详解Object.defineProperty()

本文只是把常用的内容记录一下, 更多详细说明需直接查看官方文档
)

语法

Object.defineProperty(obj, prop, descriptor)

该方法允许精确添加或修改对象的属性。通过配置可实现：1、属性是否可被枚举，能够在属性枚举期间呈现出来（for...in 或 Object.keys 方法）； 2、是否可通过赋值运算符修改； 3、是否可重新配置属性描述符(descriptor)及删除。

参数

要在其上定义属性的对象。

prop

要定义或修改的属性的名称。

descriptor

将被定义或修改的属性描述符。

返回值

被传递给函数的对象。

属性描述符(descriptor)

属性	默认值	类型	描述
configurable	false	-	当且仅当该属性的 configurable 为 true 时，该`属性描述符`才能够被改变，同时该属性也能从对应的对象上被删除。
enumerable	false	-	当且仅当该属性的enumerable为true时，该属性才能够出现在对象的枚举属性中。
value	undefined	数据描述符	该属性对应的值。可以是任何有效的 JavaScript 值（数值，对象，函数等）。
writable	false	数据描述符	当且仅当该属性的`writable`为`true`时，`value`才能被赋值运算符改变。
get	undefined	存取描述符	一个给属性提供 getter 的方法。
set	undefined	存取描述符	一个给属性提供 setter 的方法。

描述符可同时具有的键值

类型	configurable	enumerable	value	writable	get	set
数据描述符	Yes	Yes	Yes	Yes	No	No
存取描述符	Yes	Yes	No	No	Yes	Yes

即：数据描述符和存取描述符不能同时存在

configurable

var o = {};
Object.defineProperty(o, "a", { get : function(){return 1;}, 
                                configurable : false } );

// throws a TypeError
Object.defineProperty(o, "a", {configurable : true}); 
// throws a TypeError
Object.defineProperty(o, "a", {enumerable : true}); 
// throws a TypeError (set was undefined previously) 
Object.defineProperty(o, "a", {set : function(){}}); 
// throws a TypeError (even though the new get does exactly the same thing) 
Object.defineProperty(o, "a", {get : function(){return 1;}});
// throws a TypeError
Object.defineProperty(o, "a", {value : 12});

console.log(o.a); // logs 1
delete o.a; // Nothing happens
console.log(o.a); // logs 1

如果o.a的configurable属性为true，则不会抛出任何错误，并且该属性将在最后被删除。

enumerable

var o = {};
Object.defineProperty(o, "a", { value : 1, enumerable:true });
Object.defineProperty(o, "b", { value : 2, enumerable:false });
Object.defineProperty(o, "c", { value : 3 }); // enumerable defaults to false
o.d = 4; // 如果使用直接赋值的方式创建对象的属性，则这个属性的enumerable为true

for (var i in o) {    
  console.log(i);  
}
// 打印 'a' 和 'd' (in undefined order)

Object.keys(o); // ["a", "d"]

o.propertyIsEnumerable('a'); // true
o.propertyIsEnumerable('b'); // false
o.propertyIsEnumerable('c'); // false

Writable

var o = {}; // Creates a new object

Object.defineProperty(o, 'a', {
  value: 37,
  writable: false
});

console.log(o.a); // logs 37
o.a = 25; // No error thrown
// (it would throw in strict mode,
// even if the value had been the same)
console.log(o.a); // logs 37. The assignment didn't work.

// strict mode
(function() {
  'use strict';
  var o = {};
  Object.defineProperty(o, 'b', {
    value: 2,
    writable: false
  });
  o.b = 3; // throws TypeError: "b" is read-only
  return o.b; // returns 2 without the line above
}());

多个属性和默认值

var o = {};

o.a = 1;
// 等同于 :
Object.defineProperty(o, "a", {
  value : 1,
  writable : true,
  configurable : true,
  enumerable : true
});

// 另一方面，
Object.defineProperty(o, "a", { value : 1 });
// 等同于 :
Object.defineProperty(o, "a", {
  value : 1,
  writable : false,
  configurable : false,
  enumerable : false
});

最后编辑于：2020.02.07 13:28:45