ES7 中的 Object.getOwnPropertyDescriptors 方法详解-JavaScript中文网-JavaScript教程资源分享门户

在 ES7 中，新增了一个方法 Object.getOwnPropertyDescriptors，该方法可以获取一个对象所有属性的描述符。在前端开发中，我们经常需要获取一个对象的属性描述符，例如判断一个属性是否可枚举、是否可写等等，这时候 Object.getOwnPropertyDescriptors 方法就可以发挥作用。

语法

Object.getOwnPropertyDescriptors(obj)

其中 obj 为需要获取属性描述符的对象。

返回值

Object.getOwnPropertyDescriptors 方法返回一个对象，该对象的键为 obj 的所有属性名，值为对应属性的属性描述符。

属性描述符

在 ES5 中，引入了属性描述符的概念，每个属性都有自己的描述符，描述符包含以下属性：

configurable：表示该属性是否可被删除或修改特性，默认为 true。
enumerable：表示该属性是否可枚举，默认为 true。
value：表示该属性的值，默认为 undefined。
writable：表示该属性是否可写，默认为 true。
get：获取该属性的值。
set：设置该属性的值。

示例

const obj = {
  name: 'Tom',
  age: 18
}

const descriptors = Object.getOwnPropertyDescriptors(obj)

console.log(descriptors.name) 
// 输出 { value: 'Tom', writable: true, enumerable: true, configurable: true }

console.log(descriptors.age) 
// 输出 { value: 18, writable: true, enumerable: true, configurable: true }

该示例中，我们定义了一个对象 obj，包含了两个属性 name 和 age。然后使用 Object.getOwnPropertyDescriptors 方法获取 obj 的所有属性描述符，并打印出每个属性的描述符。

应用场景

判断属性是否可枚举

const obj = {
  name: 'Tom',
  age: 18
}

const descriptors = Object.getOwnPropertyDescriptors(obj)

console.log(descriptors.name.enumerable) 
// 输出 true

console.log(descriptors.age.enumerable) 
// 输出 true

该示例中，我们可以通过 Object.getOwnPropertyDescriptors 方法获取 obj 的所有属性描述符，并判断每个属性的 enumerable 属性是否为 true，从而判断该属性是否可枚举。

复制对象

const obj = {
  name: 'Tom',
  age: 18
}

const descriptors = Object.getOwnPropertyDescriptors(obj)

const newObj = Object.defineProperties({}, descriptors)

console.log(newObj) 
// 输出 { name: 'Tom', age: 18 }

该示例中，我们可以通过 Object.getOwnPropertyDescriptors 方法获取 obj 的所有属性描述符，并使用 Object.defineProperties 方法将这些属性描述符设置给一个新的对象 newObj，从而复制了 obj 的所有属性到 newObj 中。

总结

ES7 中的 Object.getOwnPropertyDescriptors 方法可以获取一个对象所有属性的描述符，方便我们在前端开发中进行属性的判断和复制。掌握该方法可以提高我们的开发效率，减少代码冗余。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/658e5345eb4cecbf2d4202d7