JavaScript海底两万里：构造器

争取一文帮自己搞清楚JavaScript中的构造器。

---

构造器

在JavaScript中，我们通常使用let obj = {...};的方式来创建一个对象，或者是通过let obj = new Object();的方式，前者属于字面量的方式，而后者就是本篇要聊的话题之一 —— 构造器Constructor。

常规的{...}语法允许创建一个对象，然而有时候需要创建很多类似的对象，例如多个用户或者菜单项等等，这类需求可以通过构造函数与"new"操作符来实现。

构造函数在技术上与常规函数相同，但是存在两个约定（不是规定）：

1. 它们的命名以大写字母开头
2. 它们只能由"new"操作符来执行

一个例子可以像这样：

function User(name) {
    this.name = name;
}

let user = new User("Jack");

这跟Java的构造方法其实有几分相似之处。在Java中，我们通过new一个class的方式在创建一个对象，实际上Java会调用这个类的构造方法来创建对象。而在JavaScript中，我们不需要像Java那么规范地先写class再写构造方法，**JavaScript的构造函数能够在通过new操作符执行时候创建一个新的空对象并分配给this**，函数体中的内容会修改this的属性，最后返回this。

技术上来说任何函数都可以作为构造器，但箭头函数除外，它没有自己的this。

对于最后“返回this”的这个步骤，其实是解释器帮助我们完成的，因为我们不需要显式地写出return语句，但并非不允许在里面写return。return语句存在一条规则：如果return返回一个对象，那么就返回这个对象，其他情况都返回this。

function User(name) {
    this.name = name;
    return { name: 'Jack' }; // 返回一个对象
}

let newUser = new User('John');

console.log(newUser); // { name: 'Jack' }

function User(name) {
    this.name = name;
    return 1; // 返回非对象
}

let newUser = new User('John');

console.log(newUser); // User { name: 'John' }

所以用构造函数来创建对象具有很大的灵活性，其实这跟Java还是比较类似的，可以暂时参考Java的类来理解JavaScript的构造函数，所以构造函数中不仅可以添加属性，也可以添加方法，像这样：

function User(name) {
    this.name = name;
    
    this.sayHi = function() {
        console.log('Hi, my name is ' + this.name + '.');
    }
}

let john = new User('John');
john.sayHi(); // Hi, my name is John.