对象的属性类型

Posted 2020-08-23 叶文翔

对象属性有两种

• 数据属性
• 访问器属性

数据属性：有四个特性

• [[configurable]](代表属性是否可配置):当这个属性描述符值为true时，该属性可能会被改变，也可能会被从相应的对象删除，默认为false。
• [[enumerable]](代表属性是否可枚举):表示能否通过for - in循环返回属性，默认为false。
• [[value]](代表属性值):包含这个属性的数据值，读取属性值的时候，从这个位置读；写入属性时，把新的值保存在这个位置，默认为undefined.
• [[writable]](代表属性是否可写):表示能否修改属性的值。

修改属性的特性必须使用Object.defineProperty()。包含三个参数：属性所在的对象，属性的名字，和一个描述符对象。

 1     var obj = {
 2         x:123,
 3         y:456
 4     }
 5     Object.defineProperty(obj,"x",{
 6         value:56,
 7         writable:true, //表示可以重新赋值写入
 8         enumerable:false, //表示不能被枚举
 9         configurable:false //表示不能被配置
10     });
11     console.log(obj.x);  //56
12     obj.x = 10;
13     console.log(obj.x);  //不能被重新赋值，输出56
14     for(var i in obj){
15         console.log(i);  //输出 y
16     }

configurable:false后：

• delete obj.x 或对象其他属性无法删除
• 这个属性后面无法再使用Object.defineProperty()方法重新配置configurable:true。
• 有一个特殊情况：writable:true可以改为false。但是writable:false无法改为true。

 1     var obj = {
 2         x:123
 3     }
 4     //等价于
 5     Object.defineProperty(obj,"x",{
 6         value:123,
 7         writable:true, 
 8         enumerable:true, 
 9         configurable:true 
10     });

1     var obj = {
2         x:123
3     }
4     Object.defineProperty(obj,"y",{value:123});

用Object.defineProperty()添加一个新的值时，其他三个属性不写，默认为false,如果只是调用此方法修改已定义的属性特性则无此限制。上面代码等价于：

1     var obj = {
2         x:123
3     }
4     Object.defineProperty(obj,"y",{
5         value:123,
6         writable:false, 
7         enumerable:false, 
8         configurable:false
9     });

可以使用Object.defineProperties（）同时设置多个属性

 1     var obj = {};
 2     Object.defineProperties(obj,{
 3         x:{
 4             value: "yewenxiang",
 5             writable:true
 6         },
 7         y:{
 8             value: "xiangwang",
 9             writable:false
10         }
11     });

访问器属性：有四个特性

• [[configurable]]:表示能否通过delete删除属性从而重新定义属性，能否修改属性的特性，能否把属性修改为数据属性。对于直接在对象定义的属性，这个特性的默认值为true。
• [[enumerable]]:表示能否通过for - in 循环返回属性。对于直接在对象定义的属性，这个特性的默认值为true。
• [[get]]:在读取属性时调用的函数。默认值为undefined
• [[set]]:在写入属性时调用的函数。默认值为undefined

使用访问器属性的常见方式：设置一个属性的值导致其他属性发生变化

 1     var obj = {
 2         x:2016,
 3         y:12
 4     };
 5     Object.defineProperty(obj,"z",{
 6         get:function(){
 7             return this.x;
 8         },
 9         set:function(newValue){
10             if(newValue > 12){
11                 this.x = 2017;
12                 this.y = 1;
13             }
14         }
15     })
16     console.log(obj.x);      //2016
17     console.log(obj.y);        //12
18     obj.z = 13;
19     console.log(obj.x);        //2017
20     console.log(obj.y);        //1
21     console.log(obj.z);        //2017

不一定非要同时指定get和set。只设置get代表属性z是不可写的，只能获取，尝试写入会被忽略，严格模式下或报错。同样只设置set代表属性z是不可读的，只能设置，尝试读取会返回undefined，在严格模式会报错。

访问器属性另外一种写法：

 1     var obj = {
 2         x:1,
 3         y:2,
 4         z:3,
 5         get zhouchang(){
 6             return this.x+this.y+this.z;
 7         },
 8         set change(value){
 9             this.x*=value;
10             this.y*=value;
11             this.z*=value;
12         }
13     };
14     console.log(obj.zhouchang); //6
15     obj.change = 2;
16     console.log(obj.zhouchang);  //12

最后可以使用Object.getOwnPropertyDescriptor()方法来获取属性特性的值：有两个参数，属性所在的对象和要被读取其描述符的属性名

• 访问器属性eg:

　　　　Object.getOwnPropertyDescriptor(obj,"x").configurable或.enumerable或.get或.set

• 数据属性eg:

　　　　Object.getOwnPropertyDescriptor(obj,"z").configurable或.enumerable或.writable或.value

----总结来自javascript高级程序设计一书。