Object.defineProperty 总结

536 阅读2分钟

为什么存在 Object.defineProperty 方法

比如我们需要描述一个人对象

const person = { name: "zhangsan", age: 18 };

是有一组属性名和值组成的集合,我们可以通过属性名访问值或修改值,这些是一般认识;

实际属性还有其他一些特性,比如

  1. 属性只读,不可以修改
  2. 属性不想被枚举出来;
  3. 属性不想被delete;

因此我们需要对属性值的行为进行描述,那么自然就产生了Object.defineProperty;

MDN摘录,在 Javascript 中, 属性 由一个字符串类型的“名字”(name)和一个“属性描述符”(property descriptor)对象构成。我们平常只关注了属性值,而没有关注更多的属性描述符;

语法

Object.defineProperty(obj, prop, descriptor)

参数

  1. obj

要定义属性的对象。

  1. prop

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

  1. descriptor

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

返回值

被传递给函数的对象。

参考:developer.mozilla.org/zh-CN/docs/…

descriptor 参数

我们重点说明 参数 descriptor,它是 一个对象;

{
configurable: false,
enumerable: false,
value: undefined,
writable: false,
get() { 
		return ...
	},
set(x){
	... = x;
	}
}

以下描述时我们以为

const person = { name: "zhangsan", age: 18 };

对象举例;

configurable

当且仅当该属性的 configurable 键值为 true 时,该属性的描述符才能够被改变,同时该属性也能从对应的对象上被删除。 默认为 false

如果 name 属性的 configurable 被设置为 false 时,执行 delete person.name返回false,也就是说无法移除;

enumerable

当且仅当该属性的 enumerable 键值为 true 时,该属性才会出现在对象的枚举属性中。 默认为 false。

如果 name 属性的 enumerable 被设置为 false 时, for (const p in person) 或者 Object.keys(person) 循环或数组中 是看不到 name;

writable

当且仅当该属性的 writable 键值为 true 时,属性的值,也就是上面的 value,才能被赋值运算符改变。 默认为 false。

如果 name 属性的 writable 被设置为 false 时, person.name = 'newvalue' 将抛出错误或无效;因此是只读属性,不允许修改;

总结:实际 Object.defineProperty 不难掌握,难的是我们要打破思维定式,因为我们太多的在使用字面量对象,在枚举属性批量处理属性,在删除属性值等操作,我们要意识到属性本身是有特征或特性的,那么这些特性就是Object.defineProperty方法完善的;