new 关键字

使用 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 语法可以更好地实现。