Javascript原型繼承中的數組和數字數據類型之間有區別嗎？

Question

我對javascript原型繼承很着迷。我可以理解下面的代碼中發生了什么

function Hamster() {  }
Hamster.prototype = {
  food: [],
  found: function(something) {
    this.food.push(something)
  }
}

// Create two speedy and lazy hamsters, then feed the first one
speedy = new Hamster()
lazy = new Hamster()

speedy.found("apple")
speedy.found("orange")

alert(speedy.food.length) // 2

下一行也是警報2 b'coz，兩個對象都共享Hamster原型的food陣列

alert(lazy.food.length) // 2

但是如果我將數組的數據類型更改為number，則兩個實例之間不會共享food鍵

function Hamster() {  }
Hamster.prototype = {
  food: 0,
  found: function(something) {
    this.food = something
  }
}

// Create two speedy and lazy hamsters, then feed the first one
speedy = new Hamster()
lazy = new Hamster()

speedy.found(123)


alert(speedy.food) // 123

但是下面這行會提示0 ，請告訴我為什么它不會提示123

alert(lazy.food) // 0

Answer 1

每個Hamster都有自己的food 。 但是在第一個版本中，它們都指向同一數組，您可以使用push修改。 在第二個版本中，它們指向整數，無法在適當位置進行修改。 found函數將重新分配該實例的屬性，這對其他實例沒有影響。

要為每個實例賦予其自己的food數組屬性，您需要使用為其分配的構造函數。

您可以通過以下內容看到類似的行為，該行為僅使用普通變量而不是對象和繼承。

arr1 = [];
arr2 = arr1;
arr1.push(1);
console.log(arr2); // prints [1]

int1 = 0;
int2 = int1;
int1 = 1;
console.log(int2); // prints 0

分配運算符'='從變量中刪除指針

arr1 = [];
arr2 = arr1;
arr2 = ['Appple'];
console.log(arr1); // prints []

Answer 2

在JavaScript中，屬性查找遵循原型鏈，但不遵循屬性分配。

所以，當你說

this.food = something;

food屬性是在對象上創建的。 因此，它覆蓋了prototype的food 。 但是，當您訪問lazy ，由於它是屬性查找，因此首先搜索當前對象，然后搜索原型，在原型中定義並為其分配值0。這就是為什么它會提示0的原因。

Answer 3

要理解的是，在第一種情況下，兩個物體仍然具有自己的food價值； 只是它們的值在每種情況下都是對內存中同一對象的引用，因此將項目推入該屬性引用的數組會更改同一數組。

我贊成的@Barmar答案已經說明了所有這些，但是這是另一個示例，應該可以幫助證明這一點：

function Hamster() {}

Hamster.prototype = {
    food: [],
    found: function(something) {
        this.food = something;
    }
}

// Create two speedy and lazy hamsters, then feed the first one
speedy = new Hamster()
lazy = new Hamster()

speedy.found(["apple"])
speedy.found(["orange"])

alert(speedy.food) // orange
alert(lazy.food) // <empty>

在這種情況下，每個food屬性都引用了不同的數組，因此很明顯每個屬性都是獨立的。

帶走的關鍵是：

保存對象的變量的值是對該對象的引用 。 擁有基元（如數字）的變量的值就是基元本身的值 。