JavaScript將原型添加到現有對象

Question

function abc(){
 this.a = "Hey this is A";   
}

var va = new abc();

va.prototype = function(){
  this.b = 'Hey b is added';
}

console.log(va.b);

va.b未定義，我以為我已經把它添加到va ？ 因為如果我在原型行之前進行控制， console.log(va)是一個對象。 上面的代碼出了什么問題？

Answer 1

看起來你真的只想為va添加一個屬性：

va.b = "Hey b is added";

但是， 如果你想增加va已經擁有的原型，你可以通過引用va的原型對象來實現，你可以通過以下幾種方式獲得：

• 鑒於上面的代碼，通過abc.prototype

• 或者在ES5 +瀏覽器上，通過Object.getPrototypeOf(va)

例如：

 function Abc() { this.a = "Hey this is A"; } var va = new Abc(); snippet.log(va.a); // "Hey this is A" snippet.log(va.b); // undefined Abc.prototype.b = 'Hey b is added'; snippet.log(va.b); // "Hey b is added" 

 <!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 --> <script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script> 

請注意，向原型添加屬性意味着使用該原型的所有對象都將繼承該屬性：

 function Abc() { this.a = "Hey this is A"; } var a1 = new Abc(); var a2 = new Abc(); Abc.prototype.b = 'Hey b is added'; snippet.log(a1.b); // "Hey b is added" snippet.log(a2.b); // "Hey b is added" 

 <!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 --> <script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script> 

Answer 2

您可能只想將屬性添加到va 。

va.b = 'Hey b is added';

除非你想要一個b屬性添加到abc所有實例，否則你可以將它添加到abc的原型：

abc.prototype.b = 'Hey b is added';

Answer 3

嘗試這個：

<script>
    function abc()
    {
        //constructor
        this.a="Hey this is A";
    }
    abc.prototype.b=function()
    {
        //prototype
        this.b='Hey b is added';
    };
    var va=new abc();//Initialization
    va.b();//value for b is assigned to the context
    console.log(va.b);
</script>

提供評論..

Answer 4

您沒有創建b屬性，因為您從未調用過va.prototype 。

function abc(){
 this.a = "Hey this is A";   
}
var va = new abc();
va.prototype = function(){
  this.b = 'Hey b is added';
};
va.b; // undefined
va.prototype();
va.b; // "Hey b is added"

請注意，使用prototype作為方法的名稱可能會令人困惑（已經存在函數的prototype和對象的[[Prototype]] ）。 我建議選擇其他名字。