Object.defineProperty() 理解

238 阅读2分钟

看了淘宝FED的装饰者模式的介绍(fed.taobao.org/blog/taofed…),得知Decorator模式的本质是使用了Object.defineProperty(),就读了下Object.defineProperty()的API,总结下重点,以备不时之需。

定义

Object.defineProperty()是用来定义一个对象的新属性,或修改对象的属性,返回的是该对象。

使用方式

Object.defineProperty(obj, value, decsriptor),有三个参数:

  • obj: 需要添加或修改属性的对象。
  • value: 要添加或修改的属性。
  • descriptor:对该属性的属性描述符进行定义。

实例如下:

var obj = {};
Object.defineProperty(obj, 'newAttribute', {
    value: '11', //可以为任何值,数字、对象、函数等等
    writable: false,
    configurable: false,
    enumerable: false
    ...
});

方法特性

用该方法定义的函数,默认情况下是不可修改、不可枚举的,不可删除的;而使用赋值运算符赋值的属性,是可枚举的(使用Object.keys或for...in方法),可改变,删除。

descriptor的具体属性解释

对象的属性描述符有两种:数据描述符、存取描述符。数据描述符指的是一个具有值的属性,该值可能可写或不可写。存取描述符指的是由getter-setter函数对进行的描述。newAttribute只能是一类描述符。它的具体属性不能掺和使用,否则会抛错。

  • 数据描述符和存取描述符均具有以下两个键值:(以上面示例中添加的newAttribute属性为例)

configurable:控制属性 newAttribute 是否可修改或删除。true:可修改、删除。默认为false,不可修改、删除。

enumerable:控制属性 newAttribute 是否可枚举。true:可枚举。默认为false。

  • 数据描述符独有的键值:

value: newAtrribute的值,可以是任何Javascript值(Number,Object,Array,String...)。默认为undefined。

writable:  newAttribute 的value属性是否可改变。默认为false。

  • 存取描述符同时具有以下可选键值

get:给属性 newAttribute 提供getter方法。若无getter,则为undefined。当访问该属性时,执行该方法。该方法无入参。默认值为undefined。

set: 给属性 newAttribute 提供setter方法。若无setter,则为undefined。当设置该属性时,执行该方法。默认值人undefined。

具体示例

具体查看MDN:developer.mozilla.org/zh-CN/docs/…