2017-08-01 8 views
0

私はJavascriptとプロトタイプの継承を学んでいて、本当にその周りに頭を浮かべていません。Javascriptのプロトタイプ継承を使用する理由

例:

function Person(firstname) { 
    this.firstname = firstname; 
    this.greet1 = function() { 
    console.log('Hi ' + this.firstname); 
    }; 
}; 

Person.prototype.greet = function() { 
    console.log('Hi ' + this.firstname); 
}; 

var John = new Person('John'); 
john.greet(); 
john.greet1(); 

両方挨拶と私は同じ結果を与えるgreet1。違いは何ですか?また、なぜこのプロトタイプを使用しますか?

+0

は、次の例を考えてみましょう。あなたは何か違うことを期待しましたか? – Tigger

+5

JavaScriptの 'prototype'と 'this'の使用は可能ですか?](https://stackoverflow.com/questions/310870/use-of-prototype-vs-this-in-javascript) – DarthJDG

+0

はどちらも同じです.. – Prabhakaran

答えて

0

最初のバージョンでは、クラスの新しいインスタンスを作成するたびにgreet1メソッドのインスタンスプロパティが作成されます。

プロトタイプアプローチでは、プロトタイプ上に一度だけプロパティgreetを作成しています。

たとえば、1000インスタンスのPersonを使用している場合は、メモリにgreet1という1000のプロパティがあります。方法2の場合、iは1だけになります。

詳細については、questionの回答をご覧ください。

0

最初の例では、Personのすべてのインスタンスに対してgreet関数のインスタンスを作成しますが、プロトタイプを使用するときは、Personインスタンスが共有する関数のコピーは1つのみです。それは、より大きなアプリケーション(メモリ賢明)に対してより効率的です。

0

ベースオブジェクトに触れることなくプロトタイプを自由に拡張できるためです。

Array.prototype.sum = function() {return this.reduce((a,b)=>a+b)};

このその後のようなものを使用します:

[1,2,3,4].sum()

どのようにこれは便利です

これは、あなたがこのような何かを行うことができることを意味しますか?

すべてのブラウザで特定の動作が発生することがあります。使用できない場合は、ベースオブジェクトをいわゆるポリフィルで塗りつぶすことができます。

あなたのオブジェクトにはどのように役立ちますか?

プロトタイプの関数はコピーされず、オブジェクトにリンクされます。メモリ使用量が減少し、実行と初期化のスピードが向上します。

物事を単純な愚かに保ち、あなたは行くのが良いです。

0

プロトタイプ作成の背後にある考え方は、重複を避けることです。プロトタイプを使用すると、新しいオブジェクトが作成されるたびにその関数を再作成する必要がないため、オブジェクトの作成を高速化できます。あなたは両方の機能に同じことをやっている

function Person(firstname) { 
this.firstname = firstname; 
this.greet1 = function() { 
console.log('Hi ' + this.firstname + ' by greet1'); 
}; 
}; 
Person.prototype.greet = function() { 
console.log('Hi ' + this.firstname + ' by greet'); 
}; 
var john = new Person('John'); 
var sam = new Person('Sam'); //a new instance created here 

john.greet1(); //Hi John by greet1 
sam.greet1(); //Hi Sam by greet1 

console.log(john);//Person{firstname: "John", greet1: function(){…}} 
console.log(sam);//Person{firstname: "Sam", greet1: function(){…}} 
//greet1 is duplicated in both the instances, we can use prototypes and 
//avoid this behaviour. 

john.greet(); //Hi John by greet 
sam.greet(); //Hi Sam by greet 

//Hence with prototypes the same result can be obtained without any 
//duplications. 
関連する問題