new
を指定して関数を呼び出すと、呼び出された関数をそのオブジェクトの「コンストラクタ」として使用して新しいオブジェクトが作成されます。
function MyFunction() {}
const myObject = new MyFunction();
typeof myObject;
> "object"`
これにより、「コンストラクタ関数」が、同じ構造パターンに従うオブジェクトを作成するためのテンプレートを提供できます。
function MyFunction() {
this.myProperty = true;
}
const myObject = new MyFunction();
myObject.myProperty;
> true
コンストラクタ関数内の this
の値は、作成されるオブジェクトを参照し、作成時にオブジェクトにプロパティとメソッドが設定されます。これにより、データ値を含むオブジェクトと、そのデータを単一のポータブル ユニットとして動作させるために必要なメソッドを作成できます。これは「カプセル化」という概念です。
function MyFunction( myArgument ) {
this.myValue = myArgument;
this.doubleMyValue = () => myArgument * 2;
}
const myObject = new MyFunction( 10 );
myObject.myValue;
> 10
myObject.doubleMyValue();
> 20
this
は、関数の現在の実行コンテキストを指します。つまり、コンストラクタ関数は、他の関数と同じ this
の値のルールに従います。たとえば、コンストラクタとして指定された関数が個別に呼び出された場合は、this
の値にグローバル バインディングを使用します。
function MyFunction() {
console.log( this );
}
const myObject = new MyFunction();
> MyFunction { }
MyFunction(); // Global `this` binding outside of strict mode is `globalThis`
> Window { … }
(function() {
"use strict";
function MyFunction() {
console.log( this );
}
MyFunction(); // Global `this` binding inside of strict mode is `undefined`
}());
> undefined
JavaScript の組み込み Factory 関数によって確立された命名パターンに従って、コンストラクタ関数の識別子の最初の文字を大文字にするのが慣例です。これらの用語が同じ意味で使用されている場合もありますが、コンストラクタ関数(新しく作成されたオブジェクトに対して new
キーワードで呼び出されたときに動作する関数)は、通常呼び出されたときに明示的に return
オブジェクトを return
する「ファクトリ関数」とは異なります。
function myFunction( myArgument = false ) {
return { "myProperty" : myArgument };
}
const myObject = myFunction( true );
myObject;
> Object { myProperty: true }
基本的な原理は同じですが、カスタム コンストラクタ関数のユースケースには、ES6 で導入された、より機能が充実した Class 構文を使用した方が適しています。