Object.create против .prototype - PullRequest
Новая
       21

Object.create против .prototype

0 голосов
/ 17 марта 2020

(Пожалуйста, закройте ЕСЛИ дубликат)

Учитывая следующий сценарий: 

function Person(first, last) {
  this.name = {
    first,
    last
  };
};

Person.prototype.greeting = function() {
  console.log('Hi! I\'m ' + this.name.first + '.');
};

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

  this.subject = subject;
}

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

Teacher.prototype.constructor = Teacher;
const t = new Teacher('John','Smith','Math');

Какая разница в использовании этого? 

 Teacher.prototype = Person.prototype;


   or this


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

1 Ответ

1 голос
/ 17 марта 2020

Если вы используете простой метод присвоения, изменения Teacher.prototype также будут влиять на Person.prototype. Это не очень хорошая идея, потому что, хотя Учитель - это Человек, Человек не обязательно является Учителем: 

function Person(first, last) {
  this.name = {
    first,
    last
  };
};
Person.prototype.greeting = function() {
  console.log('Hi! I\'m ' + this.name.first + '.');
};
function Teacher(first, last, subject) {
  Person.call(this, first, last);

  this.subject = subject;
}

// Bad:
Teacher.prototype = Person.prototype;
// Because:
Teacher.prototype.teachesClass = () => true;
// Person.prototype now has that too:
const p = new Person();
console.log(p.teachesClass());

Теперь оба .prototype одинаковы, поэтому любые мутации одного будут влиять на другого. Это почти никогда не то, что вам нужно.

В отличие от этого, когда вы используете метод Object.create, присваивания Teacher.prototype влияют только на Teacher.prototype. Объект, от которого Teacher.prototype наследуется, Person.prototype, не будет изменен: 

function Person(first, last) {
  this.name = {
    first,
    last
  };
};
Person.prototype.greeting = function() {
  console.log('Hi! I\'m ' + this.name.first + '.');
};
function Teacher(first, last, subject) {
  Person.call(this, first, last);

  this.subject = subject;
}

// Good:
Teacher.prototype = Object.create(Person.prototype);
// Because:
Teacher.prototype.teachesClass = () => true;
// Person.prototype does not have teachesClass
const p = new Person();
console.log(p.teachesClass);

Глядя на прототип цепочки: 

Teacher.prototype = Person.prototype;
// You get:
Teacher.prototype <- Object.prototype
Person.prototype <- Object.prototype
Teacher.prototype === Person.prototype // (same object)

// Compare to
Teacher.prototype = Object.create(Person.prototype);
// You get:
Teacher.prototype <- Person.prototype <- Object.prototype
...