JavaScript 对象属性操作

╰+攻爆jí腚メ 2022-05-26 05:35 249阅读 0赞

*  1. 数据属性（数据描述符）
 *  2. 访问器属性（存取描述符）
 *  3. Object.defineProperty()
 *  4. Object.defineProperties()
 *  5. Object.getOwnPropertyDescriptor()
 *  6. Object. getOwnPropertyDescriptors()

# 1. 数据属性（数据描述符） #

*  `Configurable` 表示能否通过delete删除此属性，能否修改属性的特性，或能否修改把属性修改为访问器属性，如果直接使用字面量定义对象，默认值为true
 *  `Enumerable` 表示该属性是否可枚举，即是否通过for-in循环或Object.keys()返回属性，如果直接使用字面量定义对象，默认值为true
 *  `Writable` 能否修改属性的值，如果直接使用字面量定义对象，默认值为true
 *  `Value` 该属性对应的值，默认为undefined

# 2. 访问器属性（存取描述符） #

*  `Configurable` 和数据属性的 `Configurable` 一样
 *  `Enumerable` 和数据属性的 `Enumerable` 一样
 *  `Get`
 *  `Set`

# 3. Object.defineProperty() #

*  直接在一个对象上定义或修改单个属性， 并返回这个对象。
 *  若不指定`configurable`、`writable`、`enumerable`，默认为 false
 *  若不指定`value`、`get`、`set`，默认为 undefined
 *  参数：obj（目标对象）、prop（属性名）、descriptor（描述符）

// 语法
    Object.defineProperty(obj, prop, descriptor)
    
    var obj = new Object();
    Object.defineProperty(obj, 'name', {
        configurable: false, // 能否通过 delete 删除该属性
        writable: true,      // 能否修改属性值
        enumerable: true,    // 是否可枚举
        value: 'hannah'      // 属性对应的值
    })
    
    console.log(obj.name) // => hannah

# 4. Object.defineProperties() #

*  与 `defineProperty` 不同的是可操作多个属性

// 语法
    Object.defineProperties(obj, props)
    
    var obj = new Object();
    Object.defineProperties(obj, {
        name: {
            configurable: false, // 能否通过 delete 删除该属性
            writable: true,      // 能否修改属性值
            enumerable: true,    // 是否可枚举
            value: 'hannah'      // 属性对应的值
        },
        age: {
            configurable: true,
            value: 18
        }
    })
    
    console.log(obj.name, obj.age) // hannah, 18

# 5. Object.getOwnPropertyDescriptor() #

// 语法
    Object.getOwnPropertyDescriptor(obj)
    
    var person = {
        name: 'hannah',
        age: 18
    }
    var name = Object.getOwnPropertyDescriptor(person, 'name');
    console.log(name)

*  输出：  
    ![这里写图片描述][70]

# 6. Object. getOwnPropertyDescriptor`s`() #

// 语法
    Object.getOwnPropertyDescriptors(obj)
    
    var person = {
        name: 'hannah',
        age: 18
    }
    var name = Object.getOwnPropertyDescriptors(person);
    console.log(name)

![这里写图片描述][70 1]

> 参考  
> [js中的Object.defineProperty()和defineProperties()][js_Object.defineProperty_defineProperties]

[70]: /images/20220526/dabe6f30682f46a095261a033d75f1f6.png
[70 1]: /images/20220526/0c3d239835534cb1a16689cc864937d6.png
[js_Object.defineProperty_defineProperties]: https://segmentfault.com/a/1190000011294519#articleHeader22