Javascript類封裝行爲

Question

有人可以解釋我這個JavaScript行爲嗎？我創建了2個對象（x,y），並且我撥打x.m()修改了x上的私有變量b。然後，我在x和y上調用打印方法，並生成以下輸出。如果打印方法p()定義爲this屬性（1）或作爲原型（2），則輸出會有所不同。

this.p定義作爲預期：2級的對象有兩個私有變量，對x修改b屬性不影響y的b財產。但與A.prototype.p定義，b財產似乎是靜態變量共同爲對象x和y。

在代碼

描述的行爲：

function A() { 
    var b = "bbb"; 

    function f() { 
    b = "ccc"; 
    } 

    // 1) 
    this.p = function() { 
    console.log(b); 
    }; 

    // 2) 
    //A.prototype.p = function() { 
    // console.log(b); 
    //}; 

    A.prototype.m = function() { 
    f(); 
    }; 
} 

var x = new A(); 
var y = new A(); 

x.m(); 
x.p(); 
y.p(); 

生產：

// 1) 
bbbb 
ccc 

// 2) 
//ccc 
//ccc 

Answer 1

在您的示例中，將在A構造，這意味着重寫原型方法p（以及m）每次創建實例時，原型方法都會改變。 A的所有實例都將使用相同的方法，即最後創建的實例之一。

看一看這個例子應該表現出你希望你的代碼的行爲：

function A() { 
    this.b = "bbb"; 
} 

A.prototype.p = function() { 
    console.log(this.b); 
}; 

A.prototype.m = function() { 
    this.b = "ccc"; 
}; 


var x = new A(), 
    y = new A(); 

x.m(); 
x.p(); 
y.p();