深入理解js对象

小云云

发布时间：2018-03-28 16:57:39

1482人浏览过

来源于php中文网

原创

本文主要和大家分享深入理解js对象，主要以代码结合文字和大家分享，希望能帮助到大家。

对象创建

直接量：let obj={x:1};
//具有prototype属性new方式：let obj=new Array();
//具有protope属性Object方法：Object.create(原型);

对象属性的查询与设置

let obj={x:1,y:2};
obj.x//1obj["y"]//2

ps:查询一个对象不存在的属性不会报错,如果在对象自身的属性或继承的属性中均未找到目标属性,属性访问表达式返回undefined.但是如果查询一个不存在的对象,则会报错.

删除对象属性

let book={name:"黑洞",author:"nd"};delete book.name;
//对象不存在name属性delete book[author];
//对象不存在author属性

delete:只是断开属性与对象的联系,只能删除原型对象上的自有属性.

检测对象属性

//继承const inherit=p=>{    if(p==null)throw TypeError();//p是一个对象但不能是null
    if(Object.create)return Object.create(p);//如果Object.create()存在直接使用它
    let t=typeof p;//进一步检验
    if(t!="object"&&t!=="function")throw TypeError();//检验
    function f(){};//定义一个空的构造函数
    f.prototype=p;//将其原型属性设置为p
    return new f();//}//in运算符(对象的自有属性和继承属性)let o={x:1}
console.log("x" in o)
console.log("y" in o)
console.log("toString" in o)//hasOwnProperty()(对象的自有属性(包含不可枚举属性))console.log(o.hasOwnProperty("x"))
console.log(o.hasOwnProperty("y"))
console.log(o.hasOwnProperty("toString"))//propertyIsEnumerable()(对象的自有属性且可枚举)let obj=inherit({y:2})
obj.x=1;
console.log(obj.propertyIsEnumerable("x"));
console.log(obj.propertyIsEnumerable("y")

枚举对象属性

let obj=Object.create({x:1});//for/in
//(所有可枚举的自有属性与继承属性)for(item in obj){   
 //属性名赋值给循环变量}//Object.keys()
 //(对象的可枚举自有属性)Object.keys(obj)
 //返回一个数组,数组是由对象的属性组成的
 //Object.getOwnPropertyName()
 //(所有对象的自有属性,包括不可枚举属性)Object.getOwnPropertyName(obj)

Js中的数据属性和访问器属性

在javaScript中，对象的属性分为两种类型：数据属性和访问器属性。

1.数据属性

1.数据属性：它包含的是一个数据值的位置，在这可以对数据值进行读写。

2.数据属性包含四个特性，分别是：

configurable：表示能否通过delete删除属性从而重新定义属性，能否修改属性的特性，或能否把属性修改为访问器属性，默认为true

enumerable:表示能否通过for-in循环返回属性

writable：表示能否修改属性的值

value：包含该属性的数据值。默认为undefined

如下面这个例子：创建一个对象person，打印出name属性的特性的默认值

let person={name:"johe",age:12};
console.log(Object.getOwnPropertyDescriptor(person,"name"))

3.修改数据属性的默认特性

修改属性属性的默认特性要用到一个方法：Object.defineProperty()方法，这个方法有三个参数：属性所在的对象，属性名，一个描述符对象。

通过这个方法，我们可以来修改一个属性的这4个特性。

如我们对刚刚上面的penson对象里面的name属性的特性进行修改：

    //修改数据属性
    let person={name:"johe",age:12};
    Object.defineProperty(person,"name",{value:"aa",writable:false,enumerable:false,configurable:false})

2.访问器属性

1.访问器属性：这个属性不包含数据值，包含的是一对get和set方法，在读写访问器属性时，就是通过这两个方法来进行操作处理的。

2.访问器属性包含的四个特性：

configurable：表示能否通过delete删除属性从而重新定义属性，能否修改属性的特性，或能否把属性修改为访问器属性，默认为false

enumerable:表示能否通过for-in循环返回属性,默认为false

Get：在读取属性时调用的函数,默认值为undefined

Set：在写入属性时调用的函数,默认值为undefined

这里要注意下，访问器属性不能直接定义，要通过Object.defineProperty()这个方法来定义。

下面来个例子，创建一个访问器对象book，接着打印出其year访问器属性的特性描述并对其方法进行测试打印：
这里写图片描述
执行结果：

其他两个特性configurable，enumerable的测试方式可以参照数据属性的。不过在这特别说明下，关于configurable这个特性，因为访问器属性里面这个

特性默认值为false，如果程序后面需要对该属性进行delete操作等，那就在定义访问器属性时，将这个特性设置为true，不然这个会导致后面一些报错的问题。

对象的三个属性

1.原型属性
Object.getPrototypeOf()可以查看对象的原型 (不推荐使用)
i’sPrototyOf()(推荐使用)
2.类属性
适应classof()来判断对象的类属性
3.可拓展性
Object.esExtensible()

序列化对象

let o={x:1,y:{z:[false,null,'']}};let s=JSON.stringfy(o);let p=JSON.parse(s);

中解商务通

实时捕捉一旦访问者打开您的网站，系统会立即显示，这时您就可以查看用户的信息，如：来自搜索引擎关键词、友情链接或直接访问；访问者的IP地址，所在地区，正在访问哪个网页；以及访问者使用的操作系统、浏览器、显示器屏幕分辨率颜色深度等。主动出击变被动为主动，可以主动邀请访问者进行洽谈勾通，帮助客户深入了解您的企业和产品，同时获得对方的采购意向、联系方式等信息。互动交流主动销售和在线客服合二为一，

下载