Javascript的原型，如何繼承一個類？

Question

我需要兩個類之間的繼承關系。 我喜歡在構造函數中聲明屬性； 對於方法，原型：

function Animal(){
   this.someProperty = 'someProperty';
   this.init();
}
Animal.prototype = {
   init : function(){ }
   anotherMethod : function(){ }
}

我認為聲明這樣的方法比：

 Animal.prototype.init = function(){ }
 Animal.prototype.anotherMethod = function(){}

但是，當我需要從另一個類繼承某個類時，我找不到按照自己的方式來做的方法。 這不起作用：

  Cat.prototype = new Animal();
  Cat.prototype = {
      init : function(){ }
  }

我知道我可以像下面這樣：

  Cat.prototype = new Animal();
  Cat.prototype.init = function(){ }
  Cat.prototype.anotherMethod = function(){ }

但是，有辦法嗎？

Answer 1

查看一些繼承方法以使繼承起作用：

• http://phrogz.net/JS/classes/OOPinJS2.html
• http://javascript.info/tutorial/inheritance

第一個鏈接中的示例可能對其進行了總結，該示例相似但略有不同：

function Mammal(name){ 
    this.name=name;
    this.offspring=[];
} 
Mammal.prototype.haveABaby=function(){ 
    var newBaby=new Mammal("Baby "+this.name);
    this.offspring.push(newBaby);
    return newBaby;
} 
Mammal.prototype.toString=function(){ 
    return '[Mammal "'+this.name+'"]';
} 


Cat.prototype = new Mammal();        // Here's where the inheritance occurs 
Cat.prototype.constructor=Cat;       // Otherwise instances of Cat would have a constructor of Mammal 
function Cat(name){ 
    this.name=name;
} 
Cat.prototype.toString=function(){ 
    return '[Cat "'+this.name+'"]';
} 


var someAnimal = new Mammal('Mr. Biggles');
var myPet = new Cat('Felix');
alert('someAnimal is '+someAnimal);   // results in 'someAnimal is [Mammal "Mr. Biggles"]' 
alert('myPet is '+myPet);             // results in 'myPet is [Cat "Felix"]' 

myPet.haveABaby();                    // calls a method inherited from Mammal 
alert(myPet.offspring.length);        // shows that the cat has one baby now 
alert(myPet.offspring[0]);

有一些框架專注於原型繼承，可以為您管理一些管道。

Answer 2

如果要保留與當前使用的語法相似的語法，則應該擴展原型而不是替換它。

例如，在lodash中，您可以這樣使用assign ：

_.assign(Cat.prototype, {
   init : function(){ }}
);

Answer 3

做這個

  Cat.prototype = new Animal();
  Cat.prototype = {
      init : function(){ }
  }

您將覆蓋第一個聲明，因此它將不會獲得Animal方法。

在javascript中，您只能使用原型進行繼承

  Cat.prototype = new Animal();
  Cat.prototype.init = function(){ }

Answer 4

首先，使用Object.create設置繼承

接下來，如果要使用一個對象擴展另一個對象 ，則可以使用Object.getOwnPropertyDescriptor和Object.defineProperty將其屬性描述符復制到另一個對象上，例如

function copyAtoB(A, B) {
    var d = Object.getOwnPropertyNames(A),
        i;
    for (i = 0; i < d.length; ++i)
        Object.defineProperty(
            B,
            d[i],
            Object.getOwnPropertyDescriptor(A, d[i])
        );
    return B;
}


function Animal() {
    this.isAnimal = true;
    // etc
}
Animal.prototype = Object.create(null); // Animal doesn't inherit from anything
copyAtoB({
    foo: function () { console.log('foo'); }
}, Animal.prototype);


function Cat() {
    Animal.call(this); // the Animal constructor helps build cats
    this.isCat = true;
    // etc
}
Cat.prototype = Object.create(Animal.prototype); // Cat inherits from Animal
copyAtoB({
    bar: function () { console.log('bar'); }
}, Cat.prototype);

現在我們有

var cat = new Cat();
cat.isCat; // true
cat.isAnimal; // true
cat.foo(); // logs "foo"
cat.bar(); // logs "bar"

Answer 5

您可以使用擴展方法。

Cat.prototype.extend({
  init : function(){ }
}, new Animal());

function extend(destination, source) {
  Object.keys(source).forEach(function (key) {
    if(typeof destination[key] === 'undefined') {
      destination[key] = source[key]    
    }
  }
}