Прототип наследования в JS и как получить родительские свойства - PullRequest
Новая
       51

Прототип наследования в JS и как получить родительские свойства

5 голосов
/ 03 февраля 2012

Я пытаюсь получить свойства, наследуемые от родителя, но мне неясно, как правильно это сделать.

Допустим, у меня есть: 

var Animal = function(name){
  this.offspring = [];
  this.name = name;
  return this;
}

Animal.prototype.createOffspring = function(name){
  name = name || 'Baby '+(this.offspring.length+1);
  this.offspring.push(name);
  return this;
}

Теперь я хочу добавить дочерний прототип наследовать, поэтому мне не нужно вручную добавлять все из родительского.Например, скажем, я хочу добавить Cat на основе Animal

Я хотел бы сделать это, как если бы это было Animal

var pet = new Cat('Kitty');
pet.createOffspring();

Безвручную добавив name и createOffspring к Cat constructor, который на самом деле просто Animal, но с некоторыми другими дополнительными функциями (такими как .meow() или что-то в этом роде).

Ответы [ 2 ]

4 голосов
/ 03 февраля 2012 
// Parent
function Animal() {
  this.name = 'An animal';
}

// Some child
function Cat() {
  this.speaks = 'Meow'; 
}
// Here comes inheritence
Cat.prototype = new Animal();
// Or like that
// but don't forget to put all inheritable fields to Animal's prototype
Cat.prototype = Object.create(Animal.prototype); 

// Let 'instanceof' work. Don't forget the following line, 
// because we eraese the info about constructor of Cat instances.
Cat.prototype.constructor = Cat;
// Add some custom method
Cat.prototype.meow = function() { return this.speaks; }

var cat = new Cat();
var animal = new Animal();

/// Some tests
cat.name; // A animal
animal.name; // An animal
cat.meow(); // Meow!
cat instanceof Cat; // true
cat instanceof Animal; // true

Вот и все?(UPD: ошибка с исправленным прототипом) (UPD2: Извините. Уже поздно, я делаю много ошибок ... Я должен идти спать)

Есть и другое решение, но его Chrome,Специфично для FF (может быть, другие): 

// Animal and Cat functions from above, but
Cat.prototype = {
  __proto__: Animal.prototype,
  constructor: Cat,
  meow: function() { ... }
}

Выглядит короче, но не будет искушаться этим: лучше следовать стандарту ECMAScript.

0 голосов
/ 03 февраля 2012

Существует множество различных шаблонов для реализации наследования, как вы описываете в JavaScript, и они имеют тонкие различия в том, как они обрабатывают объекты-прототипы.

Вот несколько хороших ссылок на шаблон прототипа и шаблон конструктора для начала работы.

А вот простая реализация того, что вы описали.

...