前回はオブジェクトについて基本的なところを学びました。

基礎から学ぶJavaScript.1-オブジェクトとは?

今回は前回出てきたコンストラクタについて

コンストラクタとは?

コンストラクタはオブジェクトを生成するためのテンプレートです。 前回Object()コンストラクタを使用してオブジェクトを生成しました。

Object()コンストラクタはすでにJavaScriptに用意されたコンストラクタです。 このようなJavaScriptが予め用意しているコンストラクタをネイティブオブジェクトコンストラクタと言います。

ってことは自分でコンストラクタはできるの?っていうとできるんです。 今回は独自のコンスタラクタを定義して、新しくオブジェクトを作ってみます。

独自のコンストラクタを定義する

var Person = function(){};
yusuke = new Person;
yusuke.age = 27;

console.log(yusuke); //Person {age: 27} 

コンスタラクタ関数と言うくらいなのでコンストラクタの定義は関数を作るのと変わりません。 関数を定義すると、その関数をコンストラクタとして使用することができます。 コンストラクタとして使用する関数は初めの文字を大文字で表記するのがベターです。

今回はPersonというコンストラクタ作って、newでオブジェクトを生成しました。 ですがこれでは前回Object()でオブジェクトを生成したのとあまり変わりません。

コンストラクタを独自に作るメリットは、事前にプロパティや、メソッドを設定しておくことができることです。

独自コンストラクタのメリット

var Person = function(name,age){
  this.name = name;
  this.say = function(){
    console.log('はじめまして'+ name +'です。');
  }
};

var yusuke = new Person('yusuke'); 
console.log(yusuke); //Person {name: "yusuke", say: function}
yusuke.say(); //はじめましてyusukeです。 

コンストラクタを定義した際のthis新しく生成したオブジェクトを示します。 またfunctionのカッコの中に引数を設定することではじめに数値を渡すとこが出来ます。 これを使えば、挨拶をするオブジェクトを複数作ることもできます。

var Person = function(name,age){
  this.name = name;
  this.say = function(){
    console.log('はじめまして'+ name +'です。');
  }
};

var yusuke = new Person('yusuke'); 
var ken = new Person('ken'); 
yusuke.say(); //はじめましてyusukeです。
ken.say(); //はじめましてkenです。

nameの違う同じ挙動のオブジェクトができました。

そしてもう一つ独自でコンストラクタを作る利点があります。 それはプロトタイプです。

プロトタイプは今回生成したオブジェクトの汎用な関数として定義できます。 プロトタイプは生成したオブジェクト全てに影響させることができるのです。

ただプロトタイプは説明が長くなってしまいそうなのでまた次回に。