コンストラクター

コンストラクターとは、オブジェクトを生成する枠組みみたいなもので、同じプロパティ、メソッドを持つオブジェクトを複数作る際に、とても役に立ちます。

例えば以下のようにオブジェクトを複数作るとします。

const product1 = {
    name: 'りんご',
    price: 100,
    sayInfo: () => {
        console.log('りんごの値段は100円です');
    },
};
const product2 = {
    name: 'みかん',
    price: 150,
    sayInfo: () => {
        console.log('みかんの値段は150円です');
    },
};
const product3 = {
    name: 'パイナップル',
    price: 200,
    sayInfo: () => {
        console.log('パイナップルの値段は200円です');
    },
};

これを商品の数だけ作るのはとても大変かと思います。そのような場合にまずはコンストラクターを作ります。コンストラクターはclassを使用します。コンストラクターの命名はパスカルケースで記載します。次にclass内にて、constructorメソッドを使用します。constructorメソッドはクラスが呼び出された際に最初に実行されます。constructメソッド内にて行う処理に関して、thisと記載されていますが、thisは生成されたオブジェクトそのものになります。ですので、ここでは、受け取った引数をnamepriceというプロパティにセットするようにしています。このコンストラクターから実際にオブジェクトを生成するには、new Product(’りんご', 100)のように呼び出します。

また、メソッドを定義する場合は、以下のように定義し、オブジェクト生成後は以下のように.sayInfo()で呼び出すことができます。

そのほかに、静的メソッドというものがあります。静的メソッドというのはオブジェクトを生成せず、そのコンストラクターから直接呼び出せるもので、staticを先頭につけてメソッドを定義し、呼び出す際は、コンストラクター名.メソッド名と呼び出すことができます。

以上がコンストラクターの作り方で、前セクションで説明したように配列もArrayコンストラクターからオブジェクトを生成しています。ただ配列を定義する際に、let fruits = ['りんご', 'みかん']のように定義すると思いますが、内部的にnew Array('りんご', 'みかん')のように実行されて、オブジェクトが生成されています。

その他にもすでに用意された便利なコンストラクターがありますので、後ほど紹介します。

Last updated