图解js中的Object.create方法「附代码实例」

1. Object.create方法的介绍

Object.create() 是JavaScript中用来生成一个新对象的方法。Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__。因此,可以通过委托方式基于一个对象创建一个新的对象。

let obj1 = {

a: 1,

b: 2

};

let obj2 = Object.create(obj1);

console.log(obj2.a); // 1

通过 Object.create()方法,我们可以简单地定义一个新对象,其原型为现有对象 obj1。当我们访问 obj2 的属性 a 时,因为 obj2 并没有属性 a,JavaScript 引擎会自动向 obj2 的原型对象 obj1 中寻找相应的属性 a,并返回其值 1。

2. Object.create方法的语法

Object.create的语法为:

Object.create(proto, [propertiesObject])

其中proto是新创建对象的原型对象,propertiesObject是可选的,用于定义新对象的属性。

2.1 Object.create方法的proto参数

proto参数为Object.create()创建的新对象的原型对象。原型对象可以是对象(也可以是null),新创建对象将拥有原型对象的所有属性和方法。如果没有提供任何参数,则默认proto为null。

将现有对象作为原型对象创建一个新对象:

let obj1 = {

a: 1,

b: 2

};

let obj2 = Object.create(obj1);

console.log(obj2.a); // 1

如果未提供原型,则新对象的原型为null:

let obj = Object.create(null);

console.log(obj.toString); // undefined

上述代码中,我们创建了一个新对象 obj,它的原型为 null,由于原型为 null,它的任何属性都不会继承,包括 toString() 方法。

2.2 Object.create方法的propertiesObject参数

propertiesObject是一个可选的参数,它允许我们进一步定义新对象的属性。propertiesObject 是一个包含一个或多个属性描述符的 JavaScript 对象。每个属性描述符都是包含以下键值的对象:

value:属性值。默认为 undefined。

writable:是否可写,如果为 true 则属性可以被赋值运算符改变。默认为 false。

enumerable:是否可枚举,如果为 true 则属性可以被枚举。默认为 false。

configurable:是否可配置,如果为 true,则属性可以被删除,可以修改它的特性。默认为 false。

通过以下代码,我们可以定义一个新对象 obj2,并在其中定义属性 name 和 value:

let obj = Object.create(null, {

name: {

value: "John",

writable: true,

enumerable: true,

configurable: true

},

value: {

value: "Doe",

writable: true,

enumerable: true,

configurable: true

}

});

在上述代码中,我们创建了一个名为 name 的属性和一个名为 value 的属性。当我们遍历 obj 实例时,将看到这些属性:

for (let prop in obj) {

console.log(prop + ': ' + obj[prop]);

}

// name: John

// value: Doe

3. Object.create方法的实例

3.1 Object.create方法实现继承

Object.create() 方法可以非常简单地实现继承。我们可以使用它基于父类创建一个新的类,新类 继承了父类的所有属性和方法。

请看以下实现 ES6 类继承的例子:

class Animal {

constructor(name) {

this.name = name;

}

speak() {

console.log(this.name + ' makes a noise.');

}

}

class Dog extends Animal {

constructor(name, breed) {

super(name);

this.breed = breed;

}

bark() {

console.log('Woof!');

}

}

const d = new Dog('Jack', 'Golden Retriever');

console.log(d.name); // Jack

console.log(d.breed); // Golden Retriever

d.speak(); // Jack makes a noise.

d.bark(); // Woof!

在上述代码中,我们定义了一个超类 Animal 和一个子类 Dog。通过使用 extends 关键字,我们建立了一个继承关系。我们可以通过使用 super() 方法从超类中继承特定的方法和属性。

3.2 Object.create方法实现原型式继承

原型式继承是基于已有的对象来创建新对象,新对象的原型即为所基于的对象,继承了它的所有属性和方法。

Object.create() 方法可以让我们非常轻松地实现原型式继承,毕竟它的本质就是依靠原型实现的。

let Person = {

name: "Tom",

age: 29,

sayName() {

console.log("My name is " + this.name);

}

};

let Employee = Object.create(Person, {

jobTitle: {

value: "Developer"

}

});

console.log(Employee.name); // Tom

console.log(Employee.jobTitle); // Developer

Employee.sayName(); // My name is Tom

在上述代码中,我们定义了一个 Person 对象,它包含了 name、age 和 sayName() 三个属性。然后,我们使用 Object.create() 方法创建了一个新对象 Employee,它继承了 Person 对象。在 Employee 对象中,我们还添加了一个 jobTitle 属性。

因为 Employee 是由 Person 继承而来的,我们可以通过调用 Employee 对象的 sayName() 方法来访问 Person 对象的方法。

4. 总结

Object.create() 是一个功能强大的方法,可以让我们轻松地创建新对象,继承特定的超类对象、原型对象或构造函数对象。它可以让我们的代码更灵活、更可读、更易于维护。

免责声明:本文来自互联网,本站所有信息(包括但不限于文字、视频、音频、数据及图表),不保证该信息的准确性、真实性、完整性、有效性、及时性、原创性等,版权归属于原作者,如无意侵犯媒体或个人知识产权,请来电或致函告之,本站将在第一时间处理。猿码集站发布此文目的在于促进信息交流,此文观点与本站立场无关,不承担任何责任。