JS手写New操作符

JavaScript010

JS手写New操作符,第1张

手写new操作符的流程:

 // 1.定义一个空对象

 // 2.隐式原型指向构造函数的显式原型

// 3.执行构造函数,this指向空对象

 // 4.返回对象

function myNew(fn,...args){

        // 1.定义一个空对象

          const obj={}

         // 2.隐式原型指向构造函数的显式原型

         obj._proto_=fn.prototype

         // 3.执行构造函数,this指向空对象

        fn.apply(obj,args)

          // 4.返回对象

        return obj

        }

和人交流时发现,现在面试可能会问到如何手写一个new,也就是如何自己手写方法实现new()功能 ,觉得自己从没想过,记录一下。

首先 js是如何实现new的

function Person(name){    

this.name = name

}

Person.prototype.eat =function() { 

   console.log("Eating")

}

var qd = new Person('qd')

console.log(qd)

qd.eat()

这就是js如何使用一个new的方法

手写new如下:

function create() { 

 //1.获取构造函数,并删除arguments中的第一项 

 var Con = [].shift.call(arguments)

 //2.创建一个空对象并连接到构造函数的原型,使它能够访问原型中的属性 

 var obj = Object.create(Con.prototype) 

// 3.使用apply改变构造函数中this的指向实现继承,使obj能够访问到构造函数中的属性 

 var ret = Con.apply(obj,arguments) 

 4.优先返回构造函数返回的对象

return ret instanceof Object ? ret : obj

}

function Person (name) { 

 this.name = name

}

Person.prototype.eat =function() {

 console.log("Eating")

}

//调用

var qdleader = create(Person,'qdleader')

console.log(qdleader) 

qdleader.eat() 

当然  create也可以这样写

function create() { 

 // 创建一个空的对象

let obj = {}

 // 获得构造函数 

 // 因为 arguments 类数组,所以我们可以用数组的shift来实现 arguments 的 ‘push’ 和 ‘pop’ 

 // 将 arguments 进数组,并将第一个元素移除并赋值给 

Con (Constructor).letCon = [].shift.call(arguments) 

 // 链接到原型 

 obj.__proto__ = Con.prototype 

 // 绑定this,并执行构造函数,就相当于 obj .constructor(arguments)

let result = Con.apply(obj, arguments) 

 // 确保 new 出来的是个对象

return typeof result ==='object'? result : obj

}

当然现实开发咱们直接使用new就好,这都是面试官测试你的专业知识而已,参考了网上的各种文章,不会百度的前端不是好的橱子。

首先我们先要了解new的原理

由此可以看出在new的过程中会将函数执行,并且创建一个对象 且可以通过原型链调用构造函数的原型方法,最后返回该实例

由此可以简单实现出