ECMAScript 2021：JavaScript 中的 Object 原型详解-JavaScript中文网-JavaScript教程资源分享门户

ECMAScript 2021 是 JavaScript 语言标准的最新版本，它对 Object 原型做了一些重要的改进。Object 原型是一个非常重要的概念，它是 JavaScript 中的各种数据类型和对象的基础，因此了解 Object 原型的改进对于前端开发人员来说是很重要的。在本文中，我们将详细介绍 ECMAScript 2021 中对 Object 原型的改进，并提供一些示例代码来帮助你更好地理解这个概念。

常见的 Object 方法

在介绍新的 Object 原型之前，让我们先回顾一下 ECMAScript 2021 前已经存在的常见 Object 方法。

Object.create()

Object.create() 方法用于创建一个新对象，新对象的原型指向指定的原型对象。它的语法如下：

Object.create(proto[, propertiesObject])

其中，proto 是新对象的原型，propertiesObject 是一个可选参数，用于定义新对象的属性。例如：

const proto = {
  greeting: 'Hello from the prototype!'
}

const obj = Object.create(proto)

console.log(obj.greeting) // Hello from the prototype!

Object.defineProperty() 和 Object.defineProperties()

Object.defineProperty() 方法用于在对象上定义一个新属性或修改一个已有属性的特性（如 writable、enumerable、configurable）。它的语法如下：

Object.defineProperty(obj, prop, descriptor)

其中，obj 是要定义属性的对象，prop 是要定义或修改的属性名称，descriptor 是一个描述符对象，用于设置属性的特性。例如：

// javascriptcn.com 代码示例
const obj = {}

Object.defineProperty(obj, 'greeting', {
  value: 'Hello!',
  writable: true,
  enumerable: true,
  configurable: true
})

console.log(obj.greeting) // Hello!

Object.defineProperties() 方法用于在对象上定义多个新属性或修改多个已有属性的特性。它的语法如下：

Object.defineProperties(obj, props)

其中，obj 是要定义属性的对象，props 是一个包含一个或多个属性描述符的对象。例如：

// javascriptcn.com 代码示例
const obj = {}

Object.defineProperties(obj, {
  greeting: {
    value: 'Hello!',
    writable: true,
    enumerable: true,
    configurable: true
  },
  name: {
    value: 'John',
    writable: true,
    enumerable: true,
    configurable: true
  }
})

console.log(obj.greeting) // Hello!
console.log(obj.name) // John

Object.getOwnPropertyNames() 和 Object.getOwnPropertySymbols()

Object.getOwnPropertyNames() 方法用于获取对象的所有属性名（包括不可枚举属性）。它的语法如下：

Object.getOwnPropertyNames(obj)

例如：

const obj = {
  greeting: 'Hello',
  name: 'John'
}

console.log(Object.getOwnPropertyNames(obj)) // [ 'greeting', 'name' ]

Object.getOwnPropertySymbols() 方法用于获取对象的所有 Symbol 类型属性名。它的语法如下：

Object.getOwnPropertySymbols(obj)

例如：

// javascriptcn.com 代码示例
const symbol1 = Symbol('symbol1')
const symbol2 = Symbol('symbol2')

const obj = {
  [symbol1]: 'value1',
  [symbol2]: 'value2'
}

console.log(Object.getOwnPropertySymbols(obj)) // [ Symbol(symbol1), Symbol(symbol2) ]

Object.keys() 和 Object.values()

Object.keys() 方法用于获取对象的所有可枚举属性名。它的语法如下：

Object.keys(obj)

例如：

const obj = {
  greeting: 'Hello',
  name: 'John'
}

console.log(Object.keys(obj)) // [ 'greeting', 'name' ]

Object.values() 方法用于获取对象的所有可枚举属性值。它的语法如下：

Object.values(obj)

例如：

const obj = {
  greeting: 'Hello',
  name: 'John'
}

console.log(Object.values(obj)) // [ 'Hello', 'John' ]

Object.entries()

Object.entries() 方法用于获取对象的所有可枚举属性名和属性值的键值对数组。它的语法如下：

Object.entries(obj)

例如：

const obj = {
  greeting: 'Hello',
  name: 'John'
}

console.log(Object.entries(obj)) // [ [ 'greeting', 'Hello' ], [ 'name', 'John' ] ]

新的 Object 方法

除了上面介绍的常见 Object 方法之外，ECMAScript 2021 还引入了一些新的 Object 方法。

Object.fromEntries()

Object.fromEntries() 方法用于将包含键值对的数组转换成一个对象。它的语法如下：

Object.fromEntries(entries)

其中，entries 是一个键值对数组，它的每个元素都是一个只包含两个元素的数组，第一个元素是键，第二个元素是值。例如：

const arr = [ [ 'greeting', 'Hello' ], [ 'name', 'John' ] ]
const obj = Object.fromEntries(arr)

console.log(obj) // { greeting: 'Hello', name: 'John' }

Object.getOwnPropertyDescriptors()

Object.getOwnPropertyDescriptors() 方法用于获取对象所有属性的描述符对象。它的语法如下：

Object.getOwnPropertyDescriptors(obj)

例如：

const obj = {
  greeting: 'Hello',
  name: 'John'
}

console.log(Object.getOwnPropertyDescriptors(obj)) // { greeting: { value: 'Hello', writable: true, enumerable: true, configurable: true }, name: { value: 'John', writable: true, enumerable: true, configurable: true } }

Object.is()

Object.is() 方法用于比较两个值是否相等。它的行为和 === 运算符基本相同，但会处理 NaN 和 -0/+0 的差异。它的语法如下：

Object.is(value1, value2)

例如：

console.log(Object.is(1, 2)) // false
console.log(Object.is(NaN, NaN)) // true
console.log(Object.is(0, -0)) // false

Object.freeze() 和 Object.seal()

Object.freeze() 方法用于冻结一个对象，使对象无法添加新属性、修改已有属性、删除属性。它的语法如下：

Object.freeze(obj)

例如：

// javascriptcn.com 代码示例
const obj = {
  greeting: 'Hello',
  name: 'John'
}

Object.freeze(obj)

obj.greeting = 'Hi'
obj.age = 30

console.log(obj) // { greeting: 'Hello', name: 'John' }

Object.seal() 方法用于密封一个对象，只允许修改已有属性的值。它的语法如下：

Object.seal(obj)

例如：

// javascriptcn.com 代码示例
const obj = {
  greeting: 'Hello',
  name: 'John'
}

Object.seal(obj)

obj.greeting = 'Hi'
obj.age = 30

console.log(obj) // { greeting: 'Hi', name: 'John' }

总结

本文介绍了 ECMAScript 2021 中对 Object 原型的改进，包括常见 Object 方法和新的 Object 方法。了解 Object 原型是 JavaScript 开发的基础之一，能够更好地理解 JavaScript 中的各种数据类型和对象，并能够更好地使用和操作它们。我们希望这篇文章对于前端开发人员有一定的学习和指导意义。

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