JavaScript 中 Object.create 方法的用法？

推荐答案

// www.javascriptcn.com code example
const person = {
  greet: function() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

const john = Object.create(person);
john.name = 'John';
john.greet(); // 输出: Hello, my name is John

本题详细解读

1. Object.create 方法的基本用法

Object.create 方法用于创建一个新对象，并且可以指定该对象的原型。它的语法如下：

Object.create(proto[, propertiesObject])

• proto：新创建对象的原型对象。可以是 null 或者一个对象。
• propertiesObject（可选）：一个对象，其属性将被添加到新创建的对象中，属性描述符与 Object.defineProperties 的第二个参数相同。

2. 使用 Object.create 创建对象

在上面的推荐答案中，我们首先定义了一个 person 对象，它包含一个 greet 方法。然后，我们使用 Object.create(person) 创建了一个新对象 john，并将 person 作为 john 的原型。这意味着 john 继承了 person 的 greet 方法。

const john = Object.create(person);
john.name = 'John';
john.greet(); // 输出: Hello, my name is John

3. 原型链的作用

通过 Object.create，我们可以轻松地实现原型继承。john 对象虽然没有直接定义 greet 方法，但它通过原型链继承了 person 的 greet 方法。当我们调用 john.greet() 时，JavaScript 引擎会沿着原型链查找 greet 方法，并在 person 对象中找到它。

4. 使用 Object.create(null)

Object.create(null) 会创建一个没有原型的对象。这意味着这个对象不会继承任何属性和方法，包括 Object.prototype 上的方法（如 toString、hasOwnProperty 等）。

const obj = Object.create(null);
console.log(obj.toString); // 输出: undefined

5. 使用 propertiesObject 参数

Object.create 的第二个参数 propertiesObject 允许你为新创建的对象定义属性。这些属性的描述符与 Object.defineProperties 的第二个参数相同。

// www.javascriptcn.com code example
const obj = Object.create({}, {
  name: {
    value: 'John',
    writable: true,
    enumerable: true,
    configurable: true
  },
  age: {
    value: 30,
    writable: false,
    enumerable: true,
    configurable: false
  }
});

console.log(obj.name); // 输出: John
console.log(obj.age); // 输出: 30

在这个例子中，我们创建了一个新对象 obj，并为其定义了 name 和 age 属性。name 属性是可写的，而 age 属性是不可写的。