はじめに

本記事はコンストラクタ関数について解説です。以下の記事では触れられなかったので、さくっと要点だけまとめました。こちらも合わせてご覧頂くとより理解しやすいと思います。

概要

コンストラクタ関数とは「オブジェクトを作成するための雛形」となる関数です。

特徴を挙げると、

オブジェクトを生成する際には、new演算子を使う
先頭の文字は大文字にするのが習慣
コンストラクタ関数から生成したオブジェクトはインスタンスと呼ばれる
コンストラクタ関数を用いることで同じ形式のオブジェクトを何個でも作成することができる

通常のオブジェクトの作成方法

const obj = {
  firstName: 'Taro',
  lastName: 'Sato',
  hello: function() {
    console.log('Hello');
  }
}

コンストラクタ関数を用いたオブジェクトの作成

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

const taro = new Person('Taro', 'Yamada');

以下のようにオブジェクトの雛形として使える。

new 演算子について

上述した通り、オブジェクト（インスタンス）を生成するには、new演算子を用いる。
return の記述次第で、返る結果が変わってきます。

といっても、押さえる点としてはコンストラクタ関数の戻り値がオブジェクトかそうでないかという点だけです。

コンストラクタ関数の戻り値がオブジェクトというのは以下のような場合です。

function Person(name) {
  this.name = name;
  return {hoge: 'hoge'};  // このオブジェクトが return される
}

const taro = new Person('Taro');
console.log(taro);  // {hoge: "hoge"}

そしてそれ以外の場合は基本的に this が返ります。this が返るという表現あまりしないかもしれませんが、要は以下のような普通の？ケース（戻り値を定義しないケース）です。

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

const taro = new Person('Taro', 'Yamada'); // Person {firstName: 'Taro', lastName: 'Yamada'}

面白いのは、return の後にオブジェクト型以外を記述しても返る結果は上と変わらず this になるという点です。

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
  return 99;  // 数値（プリミティブ型）を return の後に記述
}

const taro = new Person('Taro', 'Yamada'); // Person {firstName: 'Taro', lastName: 'Yamada'}