彻底搞懂“手写new”

手写new代码，百度一下，一大堆答案，每一行代码都能看懂，但是为什么它要这么做呢，本片文章带你彻底搞懂手写new原理。

1.new是做什么的？

我们都知道new是通过调用构造函数，来实例化一个对象，而实例对象能够使用构造函数中的属性和方法。

2.new如何能使实例化对象使用构造函数中的属性和方法呢？

这也就引出了原型和原型链。我们知道，原型和原型链就是，每个实例化对象都有一个隐式原型__proto__始终指向其构造函数（obj）的显式原型prototype；这也实现了继承，继承构造函数中的属性和方法。

3.new出来对象有什么特点呢？

我们从工厂模式和构造函数模式上分别来看一下

// 工厂模式
function person (name, age, gender) {
    var obj = {};
    obj.name = name;
    obj.age = age;
    return obj;
}
 
// 创建一个新对象
const p0 = person('cong', 18); 

// 这样我们得到一个新的对象 {name: 'cong', age: 18}

// 构造函数模式下
function Person (name, age) {
    this.name = name;
    this.age = age;
}
 
// 使用构造函数创建一个对象
 
const p1 = new Person('cong', 20);
 
// 得到一个新的对象 {name: 'cong', age: 20}

对比这两种模式。我们看出，构造函数中，对象出现的地方都用到了this进行替代，并且在new的时候，可以直接把对象return出来。

我们可以得出，new其实就是创建了一个新的对象，并且把构造函数中this给新建的这个对象。

4.返回值的确定?

当构造函数执行时，可能会有返回值，如果有则返回出来，如果没有则返回obj本身。

5.代码书写

function myNew(Fun,...args){
        const obj = {};  //创建空对象
        obj.__proto__=Fun.prototype; //将对象原型指向构造函数原型对象
        let result = Fun.apply(obj,args); //将构造函数this指向实例化对象
        return result instanceof Object ? result : obj; // 判断返回值
    }
    // 测试
    function Person(name){
        this.name=name;
    }
    let person = myNew(Person,"co")
    console.log(person); //Person {name: 'co'}

方法二：object.create() 

用于创建一个新对象，使用现有对象来作为新创建对象的原型。

// 利用 Object.create()方法 
function myNew (func, ...args) { 
    //创建一个空对象，将实例化对象的原型指向构造函数的原型对象
    const obj = Object.create(func.prototype);  
    //将构造函数的this指向实例化对象
    let result = func.call(obj, ...args);
    // 判断返回值
    return result instanceof Object ? result : obj;;
 
}

参考文章点这里 点这里