在JavaScript中，new操作符扮演着一个至关重要的角色，它负责创建新对象并初始化该对象，这一过程深刻体现了原型链和原型的概念。本文将深入探讨new操作的具体机制，并揭示它是如何与原型和原型链紧密协作的。

js 复制代码

    function Person() {
        this.name='Tom'
    }
    Person.prototype.age=18;
    let John=new Person();
    console.log(John.age);//输出18

初次看到以上代码，肯定十分好奇prototype是什么，John中没有age属性是如何输出18的？带着这些问题我们开始以下学习。

实例的公共祖先

prototype（显式原型）是函数自带的一个属性，它定义了构造函数创建的实例对象的公共祖先。
通过构造函数创建的对象，可以继承该函数原型上的属性。
实例对象隐式具有构造函数原型上的属性，且是只读属性。

所以结合开头示例，prototype是Person的属性，它是一个对象里面存在着Person的属性和方法。Person.prototype.age相当于给Person的原型添加了age属性，而John是通过Person创建的，所以他能访问到Person.prototype里的age属性。

那John是通过什么方式访问到Person.prototype内的属性和方法的呢？其中便涉及到了__proto__以及原型链。

`proto`（隐式原型）

是JavaScript中每一个对象（除null外）都拥有的一个非标准但广泛支持的属性，它用来访问该对象的原型（prototype）。

原型链

v8 在查找对象中的属性时，如果没找到，就会顺着对象的隐式原型往上查找，还找不到，在顺着隐式原型的隐式原型往上找,直到找到null为止，在这个过程中但凡有一个步骤能找到，就会返回值。这个链状的查找过程称为原型链。

了解了以上知识后，我们就开始探索new中的奥秘。

`new`操作的基本流程

当使用new关键字调用一个构造函数时，JavaScript引擎会执行以下四个步骤：

创建新对象 ：首先，new操作符会创建一个新的空对象，这个对象将作为构造函数的实例。
绑定this并执行构造函数 ：然后，构造函数会被调用，此时this关键字被绑定到新创建的对象上。这样，构造函数内部可以通过this来给新对象添加属性或执行其他初始化操作。
设置原型链 ：接着，这个新创建的对象内部会自动获得一个属性，即__proto__，它指向构造函数的prototype对象。这意味着新对象可以从构造函数的原型上继承属性和方法，形成了原型链的基础。
返回新对象 ：如果构造函数没有显式返回一个对象（或者返回的是非对象类型），则new操作会自动返回第一步创建的新对象。如果构造函数显示返回了一个新的对象，则返回该对象，而不是第一步创建的对象。

结合开头示例，new的过程如下

js 复制代码

function myNew(Fun,...args){
    let obj={};//创建新的空对象
    Fun.apply(obj,args);//改变Fun的this指向，并导入obj中的属性
    obj.__proto__=Fun.prototype;//让新对象中的隐式原型指向构造函数原型的显式原型
    return obj;//返回新对象即John
}

补充：没有原型的对象

虽然大多数JavaScript对象都通过原型链继承自Object.prototype，但也有例外，如使用Object.create(null)创建的对象就没有原型。这样的对象不具有任何默认的Object属性或方法，比如toString()或hasOwnProperty()，这在需要创建一个"纯净"对象时非常有用，避免了因原型链带来的潜在干扰。

结论

new操作符不仅简化了对象的创建和初始化过程，还通过原型和原型链机制实现了面向对象编程中的继承。理解new操作的内部机制，对于深入掌握JavaScript的面向对象特性至关重要。通过原型链，对象可以访问到其构造函数原型上的共享属性和方法，而特定情况下创建无原型链的对象，则为开发提供了更多的灵活性。

深入原型：new当中的奥秘

实例的公共祖先

__proto__（隐式原型）

原型链

new操作的基本流程

补充：没有原型的对象

结论

`proto`（隐式原型）

`new`操作的基本流程