JavaScript中new运算符的实现
废话不多说直接进入正题,首先我们需要先知道new运算符到底做了哪些事情,再来模拟它实现这一功能。
1. 建立一个空的Object对象;
2. 把这个空对象用__proto__链接到原型
3. 用apply绑定对象的this指向
4. 返回新的对象
知道了new的具体过程之后,我们就可以来试一下用代码实现这一过程。
1 // 传参 New(obj, ...args) 2 function New() { 3 let obj = new Object(); 4 // 提取第一个参数并作为构造函数; 5 let construction = [].shift.call(arguments); 6 // 新对象的__prop__要链接到原型链 7 obj.__proto__ = construction.prototype; 8 // 改变this指向 9 construction.apply(obj, arguments); 10 // 返回新对象 11 return obj; 12 }
下面对自定义的New方法进行验证:
1 function People(name,age){ 2 this.name = name; 3 this.age = age; 4 } 5 People.prototype.say = function () { 6 console.log(`My name is ${this.name}.`); 7 } 8 //通过new创建构造实例 9 let people1 = new People('Jack',20); 10 console.log(people1.name) // Jack 11 console.log(people1.say()) // My name is Jack. 12 13 //通过New方法创造实例 14 let people2 = New(People,'Rose',18); 15 console.log(people2.name) //Rose 16 console.log(people2.say()) //My name is Rose.
通过输出结果可以看出来,我们自己定义的New方法,是可以实现跟new运算符同等作用的。