JavaScript
prototype

prototypeってなんだっけ?

More than 1 year has passed since last update.


はじめに

JSの基本で使用する言葉の定義をまとめています。

目次はこちら


prototypeとは

コンストラクタだけが持つ特殊なプロパティで、コンストラクタからオブジェクトを生成する際に、不要なメモリ消費を押させるためのもの。

コンストラクタってなんだっけ?と言う人はこちら

コンストラクタからオブジェクトを生成する時に、全てのインスタンス変数とメソッドをコピーして生成する。

インスタンス変数は、それぞれが値を持つ必要があるが、メソッドは全オブジェクト共通であるためオブジェクトごとにコピーする必要はない。しかも、インスタンス変数より多くのメモリを消費するため、できたら、いくつもコピーしたくない。。。。

そこで活躍するのが、このprototypeだ。

//コンストラクタの定義

var Constructor = function(arg1){
this.$trigger = arg1;
}
///コンストラクタに入れていたメソッドをprototypeに登録
Constructor.prototype = {
method1: function(){
...
},
method2: function(){
...
}
}
//オブジェクトの生成
var clickCounter1 = new ClickCounter('#jsi-count-trigger1');

作成したオブジェクトにはインスタンス変数のみがコピーされ、メソッドは共通のものを参照することになる。


特徴


  • prototypeに登録されている情報は、オブジェクト生成時にコピーされない。

  • コンストラクタから作られたオブジェクトは、その時点でコンストラクタのprototypeに登録されている情報を参照できる。

  • メソッドをprototypeに登録することにより、不必要なメモリ消費を抑えることができる。