關於Javascript中的對象聲明的問題

Question

這有什么區別：

function Book() {
    this.title = '';

    this.setTitle = function(title) {
        this.title = title;
    }
}

或這個：

function Book() {
}
Book.prototype.title = '';
Book.prototype.setTitle = function(title) {
    this.title = title;
}

除了語法之外還有什么區別嗎？

Answer 1

您應該閱讀有關原型的內容 。

在第一個示例中，您在創建的Book實例上設置了函數setTitle 。

在第二個示例中，您使用的是原型繼承，換句話說，所有Books現在都繼承了相同的setTitle函數。

第二個節省內存，功能更容易在所有Book實例中“更新”。

但是第一個有它的用例，因為你可以在標題上省略this ，並通過使用閉包使變量變為私有。

function Book(title) {
    var title = title;

    this.getTitle = function() { // function keeps a reference to title
        return title; // now we only have a getter, but no setter for title
                      // thus title is essentially private
    }
}

Answer 2

使用Book.prototype.setTitle時，只創建一個setTitle函數，並將其重新用於Book的所有未來實例。

在第一個示例中，Book的每個實例都將創建每個自己的setTitle函數。

因此，建議使用原型。

Answer 3

第一個將直接在Book的實例上設置title屬性和setTitle方法。 第二個將這些成員設置在Book的原型上。 第二種通常是OOP JavaScript的更好方法。

Answer 4

昨天這個優秀的SO問題將解釋你的兩個例子之間的差異： 為什么JavaScript原型設計？