新關鍵字

使用 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 內建查詢建立的命名模式 工廠函式。雖然有時這兩個詞彙會互通使用,但建構函式 (在使用 new 關鍵字時,用於對新建構的物件執行動作的函式) 與「工廠函式」不同,後者會在正常呼叫時明確return 物件:

function myFunction( myArgument = false ) {
  return { "myProperty" : myArgument };
}
const myObject = myFunction( true );

myObject;
> Object { myProperty: true }

雖然兩者採用相同的基礎原則,但 ES6 推出的 Class 語法功能更齊全,因此更適合用於自訂建構函式。