JS：平时添加的都是数据属性

by @zhangbao(zhangbao) #0112

对象的属性有两种：数据属性和访问器属性。我们通常添加属性的方式，添加的都是数据属性。

// 添加对象属性的通常方式有两种：

// 第一种：声明时添加
let user = {
  name: "John"
}
// 第二张方式：声明后添加
user.age = 12

何以见得？我们使用 Object.getOwnPropertyDescriptors(obj) 方法就能看出来。

Object.getOwnPropertyDescriptors 方法的对象称为“属性描述符”对象。对象中的 value 就标记此属性是数据属性，value 的值就是此数据属性实际存储的值。

默认标记值都为 true

属性描述符对象中的另外三个属性 writable、enumerable、configurable 则称为属性标记（flag）——记录属性更加细粒度的设置配置。从上图可知，通常添加属性的方式，默认这些标记值都是 true，这就是为啥我们这样设置属性后，后面就可以“为所欲为”操作的原因了。

Object.defineProperty

因此可见 user.age = 12 等同于执行了下面的代码：

Object.defineProperty(user, 'age', {
  value: 12,
  writable: true,
  enumerable: true,
  configurable: true
})

我们只有想在更加细粒度的控制某个属性时，才会使用 Object.defineProperty(obj, propertyName, descriptor) 方法定义属性。

修改或添加属性

在使用 Object.defineProperty 时：如果被定义的属性已存在，则操作结果就是修改对象属性；如果被定义的属性不存在，操作结果就是为对象新增了一个属性。还是以上面的 user 为例。

例一：修改属性

修改 age 属性的 value 值为 123，enumerable 标记为 false。

可以看见，未指定的标记还是保持跟以前一样的值。

例二：添加属性

添加 desc 属性（仅标记 writable 为 true）

可以看见，其他未指明的标记默认是 false（即本例中的 enumerable 和 configurable 标记）。

（正文完）

广告时间（长期有效）

我有一位好朋友开了一间猫舍，在此帮她宣传一下。现在猫舍里养的都是布偶猫。如果你也是个猫奴并且有需要的话，不妨扫一扫她的【闲鱼】二维码。不买也不要紧，看看也行。

（完）