2

目的：仅继承对象键，而不是继承的键

两个构造函数：Person 和 Teacher。老师正在使用原型继承来继承属性。

身高和体重是从人传给老师的两个关键。

据我了解 for ... in 循环遍历对象中的所有键以及继承的键。因此 hasOwnProperty 用于过滤仅在 Teacher 对象中可用的属性。但是，代码会输出所有不应该输出的属性，包括身高和体重。

/* eslint-disable no-console */

function Person(first, last, age, gender, interests, weight, height) {
  this.name = {
    first,
    last,
  };
  this.age = age;
  this.gender = gender;
  this.interests = interests;
  this.weight = weight;
  this.height = height;
}

Person.prototype.greeting = () => {
  console.log(`Hi! I'm ${this.name.first}.`);
};

function Teacher(first, last, age, gender, interests, subject) {
  Person.call(this, first, last, age, gender, interests);

  this.subject = subject;
}

Teacher.prototype.greeting = () => {
  let prefix;

  if (this.gender === 'male' || this.gender === 'Male' || this.gender === 'm' || this.gender === 'M') {
    prefix = 'Mr.';
  } else if (this.gender === 'female' || this.gender === 'Female' || this.gender === 'f' || this.gender === 'F') {
    prefix = 'Mrs.';
  } else {
    prefix = 'Mx.';
  }

  console.log(`Hello. My name is ${prefix} ${this.name.last}, and I teach ${this.subject}.`);
};

Teacher.prototype = Object.create(Person.prototype);

Object.defineProperty(Teacher.prototype, 'constructor', {
  value: Teacher,
  enumerable: false, // so that it does not appear in 'for in' loop
  writable: true,
});

const teacher1 = new Teacher('Dave', 'Griffiths', 31, 'male', ['football', 'cookery'], 'mathematics');

for(var key in teacher1){
  if(teacher1.hasOwnProperty(key)){
    console.log(key);
  }
}

// Output: name, age, gender, interests, weight, height, subject
// weight and height should not be here

4

1 回答 1

4

,name等age属性teacher1 是自己的属性。它们不是从teacher1的原型 ( Teacher.prototype) 或其原型( Person.prototype) 继承的。尽管它Person是分配它们的，但它们仍然是自己的属性。this在对Personfrom的调用中Teacher是将分配给的对象teacher1，所以

this.age = age;

...使age自己的财产teacher1.

一旦在对象上创建了属性，就无法知道是哪个函数（如果有的话）创建了它。

您的代码还有其他几个问题：

  1. 您正在将箭头功能分配给Teacher.prototype.greeting. 不要将箭头函数用于将被继承的方法，this不会正确设置。几个相关问题的答案可能有用：

  2. 您分配给Teacher.prototype.greeting，然后Teacher.prototype完全替换 ( Teacher.prototype = Object.create(Person.prototype);)。所以你不会有greeting它的方法。

  3. 如果您按原样替换对象，Teacher.prototype请务必确保其constructor属性正确：

    Teacher.prototype = Object.create(Person.prototype);
Teacher.prototype.constructor = Teacher; // <===

但是：由于您无论如何都在使用 ES2015+ 功能（箭头函数、模板文字，...），您可以通过使用语法使这一切变得更简单。class

于 2018-11-27T17:10:28.733 回答