第十四章对象的属性类型补充

属性类型

ECMA5弄了一个新东西，就是用户可以通过Object.defineProperty配置属性的可写，可配置，可枚举, 让我们开发者可以定义一些属性。

ECMA有两种属性：数据属性，访问属性。

1. 数据属性

数据属性有4个可描述其行为特征得特性，分别是configurable(可配置)，enumerable(可枚举)，writable(可写入)，value(值)

以往我们创建一个对象，并添加一个属性的方式：

var obj = {};
obj.name = '李白';

console.log(obj.name);
// 李白
obj.name = '李小白';
console.log(obj.name);
// 李小白

现在也可以用Object.defineProperty这种方式：

Object.defineProperty(对象，属性名，描述符对象);

var obj = {};

Object.defineProperty(obj, 'name', {
    value: '李白'
});

console.log(obj.name);
// 李白
obj.name = '李小白';
console.log(obj.name);
// 李白

咦，我明明修改了obj.name为什么再次输出的还是李白？

数据属性有四种特性，分别是configurable(可配置)，enumerable(可枚举)，writable(可写入)，value(值)。如果通过以上方法创建一个属性，默认的可配置，可枚举，可写入得属性的值为false。所以不生效。

看到这几个属性，我们立刻想到，那修改可写入这一项为true可以吧，我们来试试writable属性。

var obj = {};

Object.defineProperty(obj, 'name', {
    value: '李白'
});
Object.defineProperty(obj, 'name', {
    writable: true,
    value: '杜甫'
});

// demo.js:6 Uncaught TypeError

代码执行到第6行直接报错，不再继续执行。为什么，因为默认的configurable属性为false，所以不可配置。也就是说，在第一次通过Object.defineProperty这个方法创建的时候未开启可配置属性，以后都无法更改其他特性，也包括可配置这个特性。所以只有两种方法可以解决这个问题，在创建这个属性的同时就给可配置为true，或者在第一次配置的时候就给可写为true。

Object.defineProperty(obj, 'name', {
    configurable: true,
    value: '李白'
});

Object.defineProperty(obj, 'name', {
    writable: true,
    value: '李白'
});

那现在剩下了enumerable属性，这个属性有什么作用呢？

var obj = {a: 1, b: 2, c: 3};
Object.defineProperty(obj, 'd', {
    value: 4
});

for(var k in obj) {
    console.log(k);
}
// a   b   c

enumerable默认为false得情况下，for in 循环只遍历到了abc这三个属性。

Object.defineProperty(obj, 'd', {
    enumerable: true,
    value: 4
});

for(var k in obj) {
    console.log(k);
}
// a   b   c   d

属性改为true的情况下，可以遍历到了，这也就是可枚举。

Object.defineProperties

可以一次定义多个属性， 方便快捷

var obj = {};

Object.defineProperties(obj, {
    a: {value: 1},
    b: {value: 2},
    c: {value: 3}
});

console.log(obj);
// {a: 1, b: 2, c: 3}

Object.getOwnPropertyDescriptor

这个属性可以罗列出属性的上述四种特性，接上代码在控制台：

MacHi 2019-02-14 14-01-48.png

2. 访问器属性

访问器属性不包含数据值，它们包含一对getter和setter函数（非必须），在读取访问器属性时，调用了getter函数，这个函数负责返回有效的值。在写入访问器属性的时候，回调用setter属性，这个函数负责决定如何处理数据。访问器有四个特性,分别是configurable(可配置)，enumerable(可枚举)，get(读取属性调用的函数)，set(设置属性调用的函数)

set和get

var obj = {
    _year: 2019,
    edition: 1
};

Object.defineProperty(obj, 'year', {
    get: function () {
        return this._year;
    },
    set: function (newValue) {
        if (newValue > 2019) {
            this._year = newValue;
            this.edition += newValue - 2019;
        }
    }
});

obj.year = 2020;
console.log(obj.edition);

第十四章 对象的属性类型补充