摘要：可枚舉性屬性是一個(gè)布爾值，表示目標(biāo)屬性是否可枚舉。可配置性返回一個(gè)布爾值，決定了是否可以修改屬性描述對(duì)象。其中，存值函數(shù)稱為，使用屬性描述對(duì)象的屬性取值函數(shù)稱為，使用屬性描述對(duì)象的屬性。

JavaScript 提供了一個(gè)內(nèi)部數(shù)據(jù)結(jié)構(gòu)，用來描述對(duì)象的屬性，控制它的行為，比如該屬性是否可寫、可枚舉等等。這個(gè)內(nèi)部數(shù)據(jù)結(jié)構(gòu)稱為“屬性描述對(duì)象”（attributes object）。每個(gè)屬性都有自己對(duì)應(yīng)的屬性描述對(duì)象，保存該屬性的一些元信息。

屬性描述對(duì)象的各個(gè)屬性稱為“元屬性”，因?yàn)樗鼈兛梢钥醋魇强刂茖傩缘膶傩浴?/p> value

value 屬性是目標(biāo)屬性的值。

var obj = { p : 123 };

Object.getOwnPropertyDescriptor(obj, "p").value   // 123

Object.defineProperty(obj, "p", { value: 246 });
obj.p     // 246

改寫 value 屬性時(shí)，只要 writable 和 configurable 有一個(gè)為 true，就允許改動(dòng)。只有 writable 和 configurable 兩個(gè)都為 false 時(shí)，value 屬性才不可改寫。

var obj = Object.defineProperty({}, "p", {
  value: 1,
  writable: false,
  configurable: false
});

Object.defineProperty(obj, "p", {value: 2})
// TypeError: Cannot redefine property: p

obj.p = 4
obj.p       // 1

value 屬性不可改寫時(shí)，直接屬性賦值，不報(bào)錯(cuò)，但不會(huì)成功。在嚴(yán)格模式下會(huì)報(bào)錯(cuò)，即使對(duì)屬性重新賦予一個(gè)同樣的值。

writable 屬性是一個(gè)布爾值，決定了目標(biāo)屬性的值 value 是否可以被改變。

var obj = {};

Object.defineProperty(obj, "a", {
  value: 37,
  writable: false
});

obj.a         // 37
obj.a = 25;
obj.a         // 37

如果原型對(duì)象的某個(gè)屬性的 writable 為 false，那么子對(duì)象將無法自定義這個(gè)屬性。

var proto = Object.defineProperty({}, "foo", {
  value: "a",
  writable: false
});

var obj = Object.create(proto);

obj.foo = "b";
obj.foo    // "a"

但是，有一個(gè)規(guī)避方法，就是通過覆蓋屬性描述對(duì)象，繞過這個(gè)限制。原因是這種情況下，原型鏈會(huì)被完全忽視。

Object.defineProperty(obj, "foo", {
  value: "b"
});

obj.foo   // "b"

enumerable （可枚舉性）屬性是一個(gè)布爾值，表示目標(biāo)屬性是否可枚舉。

如果一個(gè)屬性的 enumerable 為 false 時(shí)，下面四個(gè)操作將不會(huì)取到該屬性。

for..in 循環(huán)

Object.keys() 方法

JSON.stringify() 方法

Object.assign()：只拷貝對(duì)象自身的可枚舉的屬性。

var obj = {};

Object.defineProperty(obj, "x", {
  value: 123,
  enumerable: false
});

obj.x                   // 123
for (var key in obj) {console.log(key);}  // undefined
Object.keys(obj)        // []
JSON.stringify(obj)     // "{}"

JSON.stringify 方法會(huì)排除 enumerable 為 false 的屬性，如果對(duì)象的 JSON 格式輸出要排除某些屬性，就可以利用這一點(diǎn)把這些屬性的 enumerable 設(shè)為 false。

configurable (可配置性）返回一個(gè)布爾值，決定了是否可以修改屬性描述對(duì)象。也就是說，configurable 為 false 時(shí)，value、writable、enumerable 和 configurable 都不能被修改了。

var obj = Object.defineProperty({}, "p", {
  value: 1,
  writable: false,
  enumerable: false,
  configurable: false
});

Object.defineProperty(obj, "p", {value: 2})
// TypeError: Cannot redefine property: p

Object.defineProperty(obj, "p", {writable: true})
// TypeError: Cannot redefine property: p

Object.defineProperty(obj, "p", {enumerable: true})
// TypeError: Cannot redefine property: p

Object.defineProperty(obj, "p", {configurable: true})
// TypeError: Cannot redefine property: p

注意，writable 只有在 false 改為 true 時(shí)會(huì)報(bào)錯(cuò)，true 改為 false 是允許的。

var obj = Object.defineProperty({}, "p", {
  writable: true,
  configurable: false
});

Object.defineProperty(obj, "p", {writable: false})  // 修改成功

可配置性決定了目標(biāo)屬性是否可以被刪除（delete）。configurable 為 true 時(shí)，屬性可以被刪除，為 false 時(shí)，屬性不可被刪除。

var obj = Object.defineProperties({}, {
  p1: { value: 1, configurable: true },
  p2: { value: 2, configurable: false }
});

delete obj.p1    // true
delete obj.p2    // false

obj.p1    // undefined
obj.p2    // 2

除了直接定義以外，屬性還可以用存取器（accessor）定義。其中，存值函數(shù)稱為 setter，使用屬性描述對(duì)象的 set 屬性；取值函數(shù)稱為 getter，使用屬性描述對(duì)象的 get 屬性。

一旦對(duì)目標(biāo)屬性定義了存取器，那么存取的時(shí)候，都將執(zhí)行對(duì)應(yīng)的函數(shù)。利用這個(gè)功能，可以實(shí)現(xiàn)許多高級(jí)特性，比如某個(gè)屬性禁止賦值。

var obj = Object.defineProperty({}, "p", {
  get: function () { return "getter"; },
  set: function (value) { console.log("setter: " + value); }
});

obj.p          // "getter"
obj.p = 123    // "setter: 123"

一旦定義了取值函數(shù) get 或存值函數(shù) set，就不能同時(shí)定義 writable 屬性或 value 屬性，否則會(huì)報(bào)錯(cuò)。如果通過 Object.defineProperty() 重定義 writable 屬性或 value 屬性，那么取值函數(shù) get 和存值函數(shù) set 將會(huì)被 value 和 writable 覆蓋。

var obj = Object.defineProperty({}, "p", {
  get: function () { return "getter"; },
  set: function (value) { console.log("setter: " + value); },
  configurable: true
});
    
Object.getOwnPropertyDescriptor(obj,"p")
// { get: ? (),
//   set: ? (value),
//   enumerable: false,
//   configurable: true
// }

// 重定義
Object.defineProperty(obj, "p", { writable:true });
Object.getOwnPropertyDescriptor(obj,"p")
// {value: undefined, writable: true, enumerable: false, configurable: true}

JavaScript 還提供了存取器的另一種寫法。與定義屬性描述對(duì)象是等價(jià)的，而且使用更廣泛。

var obj = {
  get p() {
    return "getter";
  },
  set p(value) {
    console.log("setter: " + value);
  }
};

注意，取值函數(shù) get 不能接受參數(shù)，存值函數(shù) set 只能接受一個(gè)參數(shù)（即屬性的值）。

存取器往往用于，屬性的值依賴對(duì)象內(nèi)部數(shù)據(jù)的場(chǎng)合。

var obj ={
  $n : 5,
  get next() { return this.$n },
  set next(n) {
    if (n >= this.$n) this.$n = n;
    else throw new Error("新的值必須大于當(dāng)前值");
  }
};

obj.next         // 5

obj.next = 10;
obj.next         // 10

obj.next = 5;    // Uncaught Error: 新的值必須大于當(dāng)前值

Object.getOwnPropertyDescriptor() 可以獲取某個(gè)屬性的屬性描述對(duì)象。它的第一個(gè)參數(shù)是對(duì)象，第二個(gè)參數(shù)是對(duì)象的某個(gè)屬性名。返回的是該屬性的屬性描述對(duì)象。

var obj = { p1: "a",  p2: "b"};

Object.getOwnPropertyDescriptor(obj, "p1")
// { value: "a",
//   writable: true,
//   enumerable: true,
//   configurable: true
// }
    

只能用于對(duì)象自身的（非繼承的）屬性。繼承的或不存在的屬性返回 undefined。

Object.getOwnPropertyDescriptor(obj, "toString")   // undefined

Object.getOwnPropertyDescriptors() 可以獲取參數(shù)對(duì)象的所有屬性的屬性描述對(duì)象。ES2017 引入標(biāo)準(zhǔn)。

Object.getOwnPropertyDescriptors(obj)
// { p1: {value: "a", writable: true, enumerable: true, configurable: true}
//   p2: {value: "b", writable: true, enumerable: true, configurable: true}
// }

Object.defineProperty() 方法允許通過屬性描述對(duì)象，定義或修改一個(gè)屬性，然后返回修改后的描述對(duì)象。

Object.defineProperty(object, propertyName, attributesObject)

Object.defineProperty() 方法接受三個(gè)參數(shù)，依次如下。

object：屬性所在的對(duì)象

propertyName：字符串，表示屬性名

attributesObject：屬性描述對(duì)象

var obj = Object.defineProperty({}, "p", {
  value: 123,
  writable: false,
  enumerable: true,
  configurable: false
});
obj.p         // 123
obj.p = 246;
obj.p         // 123

注意，上例中第一個(gè)參數(shù)是{ }（一個(gè)新建的空對(duì)象），p屬性直接定義在這個(gè)空對(duì)象上面，然后返回這個(gè)對(duì)象，這是 Object.defineProperty() 的常見用法。

如果屬性已經(jīng)存在，Object.defineProperty() 方法相當(dāng)于更新該屬性的屬性描述對(duì)象。

Object.defineProperties() 方法可以定義或修改多個(gè)屬性。接受兩個(gè)參數(shù)。

var obj = Object.defineProperties({}, {
  p1: { value: 123, enumerable: true },
  p2: { value: "abc", enumerable: true },
  p3: { get: function () { return this.p1 + this.p2 },
    enumerable:true,
    configurable:true
  }
});

obj.p1  // 123
obj.p2  // "abc"
obj.p3  // "123abc"

元屬性默認(rèn)值

Object.defineProperty() 和 Object.defineProperties() 參數(shù)里面的屬性描述對(duì)象，writable、configurable、enumerable 這三個(gè)屬性的默認(rèn)值都為 false。

var obj = {};
Object.defineProperty(obj, "foo", {});
Object.getOwnPropertyDescriptor(obj, "foo")
// {
//   value: undefined,
//   writable: false,
//   enumerable: false,
//   configurable: false
// }

實(shí)例對(duì)象的 propertyIsEnumerable() 方法返回一個(gè)布爾值，用來判斷某個(gè)屬性是否可枚舉。

var obj = {};
obj.p = 123;

obj.propertyIsEnumerable("p")           // true
obj.propertyIsEnumerable("toString")    // false

注意，這個(gè)方法只能用于判斷對(duì)象自身的屬性，對(duì)于繼承的屬性一律返回 false。

參考鏈接：JavaScript 教程 屬性描述對(duì)象