前言

尴尬而不失礼貌的微笑

怎么new一个对象呢？今天我们就来谈谈JS中，怎样使用new关键字创建一个对象及其实现原理。
下文中涉及到的题外知识点：

• es6-扩展运算符

console.log(...[1, 2, 3])
// 1 2 3

• es6-变量的解构赋值

let [head, ...tail] = [1, 2, 3, 4];
head // 1
tail // [2, 3, 4]

new一个对象

new 操作符后跟一个构造函数。构造函数可以是JS原生引用类型（比如：Object、Array、Date、Number等），也可以是自定义函数。
比如这样

var person = new Object();
var colors = new Array();   // 数组也是对象哟

或者这样

function Person(age) {
  this.age = age;
  console.log(this)
}
var p1 = new Person(20);

实现原理

1、创建一个空对象
2、让空对象的_proto_（IE没有该属性）成员指向了构造函数的prototype成员对象
3、使用apply调用构造器函数，属性和方法被添加到 this 引用的对象中
4、如果构造函数中没有返回其它对象，那么返回 this，即创建的这个的新对象，否则，返回构造函数中返回的对象
具体如下：

function _new() {
    let obj= {}; // 创建的新对象
    // 第一个参数是构造函数
    let [constructor, ...args] = [...arguments];

    // 执行 [[原型]] 连接 ;实际上就是生产了一个新的上下文
    obj.__proto__ = constructor.prototype;

    // 使用apply在obj作用域中调用构造器函数，属性和方法被添加到 this 引用的对象即obj中
    let result = constructor.apply(obj, args);
    if (result && (typeof (result) == "object" || typeof (result) == "function")) {
        // 如果构造函数执行的结果返回的是一个对象，那么返回这个对象
        return result;
    }
    // 如果构造函数返回的不是一个对象，返回创建的新对象
    return obj;
}

结合下面的代码片段来具体分析下：
代码片段一

    function Person(age){
        this.age= age;
        console.log(this);
        return {age:age};//返回对象
    }
    Person.prototype.index = 1

    var person1 = new Person(20);  // 此处相当于var person1=_new(Person, 20)
    var person2 = Person(18);
     
    console.log(person1);
    console.log(person2);

    console.log('p1.index=', person1.index)
    console.log('p2.index=', person2.index)

片段一执行结果

• obj._proto_ = constructor.prototype，即 obj._proto_ = Person.prototype，
  将obj的_proto_（隐式原型）指向Person的原型对象，此时obj的原型链为：
  obj => Person.prototype => Object.prototype => null
  因此 执行到let result = constructor.apply(target, args)这句代码时，在obj作用域中调用Person函数，打印出 Person {age: 20}
  因为Person函数返回的是一个对象，所以console.log(person1)打印出的就是返回的这个对象：{age: 20}，person1.index自然就为undefined

而var person2 = Person(18)，只是简单的调用了Person函数，在window全局中执行，所以打印出Window对象，执行console.log(person2)打印出：{age: 18}，person2.index为undefined

代码片段二

    function Person(age){
        this.age= age;
        console.log(this);
        // return {age:age};//返回对象
    }
    Person.prototype.index = 1

    var person1 = new Person(20);  // 相当于var person1 = _new (Person, 20);
    var person2 = Person(18);
     
    console.log(person1);
    console.log(person2);

    console.log('p1.index=', person1.index)
    console.log('p2.index=', person2.index)

片段二执行结果

总结

通过new操作符，我们可以创建原对象的一个实例对象，而这个实例对象继承了原对象的属性和方法，所以new存在的意义在于它实现了javascript中的继承，而不仅仅是实例化了一个对象。

PS: 本文参考了网上的一些文章加之自己的理解，若有错误或者不准确的地方，欢迎留言纠正，非常感谢！

参考链接：

JavaScript：new关键字创建对象底层原理
JavaScript new原理