前端面试题：ES5与ES6构造函数

定义

在 JavaScript 中，使用new关键字调用的函数被称为构造函数（Constructor）。它的主要作用就是初始化一个新创建的对象。

构造函数是一个特殊的函数，当我们使用new关键字调用它时，它会执行以下操作：

1. 创建一个新的空对象。
2. 将这个新对象的内部链接（[[Prototype]]）设置到构造函数的prototype对象上。
3. 将这个新对象作为this上下文。
4. 如果该函数没有返回其他对象，那么new表达式中的函数调用会自动返回这个新对象。

ES6 构造函数

class Example {
    constructor(name) {
        this.name = name;
    }
    init() {
        const fun = () => { console.log(this.name) }
        fun();
    }
}
const e = new Example('upstream');
e.init(); // 输出 upstream

ES5 构造函数

function Example(name) {
    // ES6 的 class 中的所有代码均处于严格模式之下，需使用严格模式
    'use strict';
    // ES6 中的 class 必须通过 new 来调用，需加入 new.target 来判断调用方式
    if (!new.target) {
        throw new TypeError('build error without new');
    }
    this.name = name;
}

Object.defineProperty(Example.prototype, 'init', {
    // ES6 中的原型方法是不可被枚举，需使用 enumerable 属性描述符让其不可枚举
    enumerable: false,
    value: function () {
        // ES6 的 class 中的所有代码均处于严格模式之下，需使用严格模式
        'use strict';
        // 原型上的方法不允许通过 new 来调用，需加入 new.target 来判断调用方式
        if (new.target) {
            throw new TypeError('init error');
        }
        var fun = function() {
            console.log(this.name);
        }
        fun.call(this);
    }
});

const e = new Example('upstream');
e.init();