实现一个new

JavaScript面向对象的实质是基于原型的对象系统,而不是基于类。

new关键字做了什么

1. 创建一个空对象，这个对象将会作为执行构造函数之后返回的对象实例。
2. 使上面创建的空对象的原型（__proto__）指向构造函数的prototype属性。
3. 将这个空对象赋值给构造函数内部的this，并执行构造函数逻辑。
4. 根据构造函数执行逻辑，返回第一步创建的对象或构造函数的显式返回值。

因为new是JS的关键字，我们不能直接将其覆盖，但可以通过实现一个newFunc来进行模拟，先来看一个预期示例：

function Person(name){
    this.name = name;
}
const person = new newFunc(Person,'carol')
console.log(person);

// {name:"carol"}

根据预期的使用方式，我们来实现newFunc，代码如下：

function newFunc(...args){
    //取出args数组第一个参数，即目标构造函数
    const constructor = args.shift();

    //创建一个空对象，且使这个空对象继承构造函数的prototype属性
    //即实现obj.__proto__ = constructor.prototype
    const obj = Object.create(constructor.prototype);

    //执行构造函数，得到构造函数返回结果
    const result = constructor.apply(obj,args);

    //如果构造函数执行后，返回结果是对象类型，则直接将该结果返回，否则返回obj对象
    return (typeof result === 'object' && result != null) ? result : obj;
}

上述代码涉及以下几个关键点：

• 使用Object.create使obj的__proto__指向构造函数的原型。
• 使用apply方法使构造函数内的this指向obj。
• 在newFunc返回时，使用三目运算符决定返回结果。

构造函数如果有返回值，且返回值为对象类型，那么构造函数返回结果就不再是目标实例，代码如下：

function Person(name){
    this.name = name;
    return {1:1}
} 
const person = new newFunc(Person,'carol')
console.log(person);

//{1：1}