使用“new”运算符创建对象的实例可以工作

Question

这里有点JavaScript新手。我在这里有以下2个JavaScript代码片段，它们没有达到我所期望的。这些示例使用“new”运算符在示例 #1 中创建对象“Person”的实例，并使用 ES5 Object.create（） 属性在示例 #2 中创建“Person”的原型。

let Person = function(name, age, city) {

    this.name = name;

    this.age = age; 

    this.city = city

}

// Using 'new' operator (working)

let person1 = new Person("Jack Rabit", 40, "Seattle");

Object.values(person1); // Shows "Jack Rabit", 40, "Seattle"

但是，使用 Object.create（） 属性执行以下操作...不显示属性的第一个值（在本例中为“name”）：

let person2 = Object.create(Person);

person2.name = "Will"; 

person2.age=41; 

person2.city="San Jose";

Object.values(person2); // Shows 41, "San Jose" (Does NOT show the value of the "name" property)

我错过了什么？

Answer 1

因此，通常当我使用时，我会传递一个对象以在原型中使用。您当前正在将函数作为参数传递。这种方式有效Object.create()const Person = function(name, age, city) {    this.name = name;    this.age = age;     this.city = city}const person2 = Object.create(new Person());person2.name = "Will"; person2.age=41; person2.city="San Jose";Object.values(person2);这可能与函数本身有自己的属性这一事实有关？但我不太确定name编辑：确认只是因为名称属性，将名称更改为标题以避免混淆：const Person = function(title, age, city) {    this.title = title;    this.age = age;     this.city = city}const person2 = Object.create(Person);person2.title = "Will"; person2.age=41; person2.city="San Jose";Object.values(person2);// ["Will", 41, "San Jose"]

Answer 2

Object.create创建一个新对象，将给定对象作为其 .[[prototype]]您在此处尝试错误地继承属性。您正在创建具有构造函数作为其原型的对象。所有函数都有一个名为 的不可枚举和不可写属性。你可以看到person2PersonnameObject.getOwnPropertyDescriptor(Person, "name")该线路实际上试图覆盖此属性，并且不执行任何操作。也有效地成为一种功能。person2.name = "Will";person2在这里，正确的用法是let person2 = Object.create(new Person());

Answer 3

Object.create 需要一个对象来创建另一个对象。因此，请使用 Person 函数返回对象。它应该看起来像这样： let Person = function(name, age, city) {  return {    name,    age,    city  };}// Using 'new' operator (working)let person1 = new Person("Jack Rabit", 40, "Seattle");let person2 = Object.create(Person());person2.name = "Will"; person2.age=41; person2.city="San Jose";

Answer 4

Object.create需要一个对象来创建另一个对象，因此虽然是一个函数（确切地说是一个函数构造函数）也是javaScript中的一个对象。因此，Object.create不会抱怨，但是当它以这种方式完成时，引擎盖下发生了什么：Personlet person2 = Object.create(Person);person2最终被分配了一个名为“Person”的函数的一些属性（它本身不是一个函数，它不能被调用），这可以在这里看到：// person2.name = 'Person'// person2() Uncaught TypeError: person2 is not a function at <anonymous>:1:1作为函数的继承属性之一，其名称是只读的，因此不会产生任何影响。Function.name MDN 文档person2.name = 'some name'运算符将调用构造函数，构造函数将在继承构造函数的原型时返回一个对象new