功能擴展其他功能與原型

Question

這是我的JavaScript代碼：

function animal(){ 
    var animal_sound; 
    this.animal = function(sound){ 
     animal_sound = sound; 
    } 

    this.returnSound = function(){ 
     return animal_sound; 
    } 
} 

function cat(){ 
    this.cat = function(sound){ 
     this.animal(sound); 
    } 
} 
cat.prototype = new animal() 
cat.prototype.constructor = cat; 

//Create the first cat 
var cat1 = new cat(); 
cat1.cat('MIAO');//the sound of the first cat 

//Create the second cat 
var cat2 = new cat(); 
cat2.cat('MIAAAAUUUUUU');//the sound of the second cat 

alert(cat1.returnSound()+' '+cat2.returnSound()); 

只要我有cat功能擴展animal功能。比我創造了兩隻不同的貓（cat1和cat2）。每隻貓都有自己的聲音，但是當我打印他們的聲音，我獲得：

MIAAAAUUUUUU MIAAAAUUUUUU

的cat2聲音覆蓋cat1聲音，我也不想這樣。

我想獲得：

MIAO MIAAAAUUUUUU

誰能幫助我？

Answer 1

animal()和.returnSound()方法在原型上，所以它們在cat的所有實例之間共享。

因爲他們在animal構造函數創建，並利用每次調用.animal()時間在構造函數中的作用域的變量，你覆蓋所使用的.animal()和.returnSound()相同的變量。

要做你想做的事，你需要爲每個cat創建一個新的.animal()和.returnSound()方法。

---

function animal(){ 
    var animal_sound; 
    this.animal = function(sound){ 
     animal_sound = sound; 
    } 

    this.returnSound = function(){ 
     return animal_sound; 
    } 
} 

function cat(){ 
    animal.call(this); // apply the `animal()` function to the new `cat` object 
    this.cat = function(sound){ 
     this.animal(sound); 
    } 
} 
cat.prototype = new animal() 
cat.prototype.constructor = cat; 

現在，當您創建的貓，他們將有自己的.animal()和.returnSound()方法，這將在animal單獨調用每個cat創建，這樣就會有一個新的animal_sound每對這些方法。

var cat1 = new cat(); 
cat1.cat('MIAO'); 

var cat2 = new cat(); 
cat2.cat('MIAAAAUUUUUU'); 

alert(cat1.returnSound()+' '+cat2.returnSound()); // MIAO MIAAAAUUUUUU 

---

當然，在這樣做，你不採取原型繼承的多少優勢。

Answer 2

那是因爲你設置的雛形了

cat.prototype = new animal() 

每個動物實例都有自己的「私人」 animal_sound變量，但所有cat實例從相同animal實例繼承，因此他們「分享」這個變量。

相反，你應該調用animal爲每個cat實例：

function cat(){ 
    animal.call(this); 

    this.cat = function(sound){ 
     this.animal(sound); 
    } 
} 

你甚至都不需要在這種情況下，任何分配給cat.prototype。但是，如果您打算將方法添加到原型（您應該），請使用Object.create來設置繼承。更多的信息在這裏：Benefits of using `Object.create` for inheritance。