?预备知识:理解原型和原型链理解thisbinding1newoperator介绍MDN文档:newoperatorcreatesaninstanceofauser-definedobjecttype或具有结构函数的内置对象的实例。类Person{构造函数(名称){this.name=name;}}//创建一个自定义对象类型的实例constperson=newPerson('Xiaoming')//创建一个带构造函数的内置对象实例constdate=newDate()new的功能:创建一个对象的实例2new究竟做了什么?上面说了new的作用是创建一个对象的实例,那么它到底是如何创建实例的,它内部做了哪些事情呢?以newPerson()为例,当它执行时,会发生以下事情:创建一个空的简单JS对象constobj={}给这个对象加上属性__proto__,并将这个属性链接到构造函数的原型对象obj。__proto__=Person.prototype调用构造函数Person并将this绑定到新创建的对象objPerson.apply(obj)如果构造函数没有显式返回一个对象,则返回新创建的对象,即obj3模拟new的实现operation如上所述,newoperator做了这4件事。接下来,我们将按照这4个步骤,用函数模拟new(面试手写代码)的实现。const_new=function(constructor,...args){constobj={}obj.__proto__=constructor.prototypeconstres=constructor.apply(obj,args)//这一步会在“补充”中详细说明returnresinstanceof对象?res:obj}代码很简单,按照上面的4stepbystep一步步写就可以了补充ES5提供了Object.create方法,可以创建一个对象,让新对象的__proto__属性指向到现有对象。所以我们可以用这个方法把步骤1和步骤2结合起来。constobj=Object.create(constructor.prototype)//等价于constobj={}obj.__proto__=constructor.prototype为什么最后一行代码在_new函数:返回resinstanceof对象?res:obj因为第四步的new操作符会分为以下三种情况:如果构造函数没有显式返回(通常)那么person就是新创建的对象obj如果构造函数返回的不是一个Object,比如1,"abc",那么person还是一个新创建的对象被创建,但是显式返回的对象functionPerson(){//函数也是一个对象returnfunction(){}}注意模拟函数_new传入的参数只能是构造函数,不能是一个classclassAnimal{...}_new(Animal)//会报错:ClassconstructorAnimalcannotbeinvokedwithout'new'//类只能通过new创建实例
