JavaScript:new的实现原理
new运算符会创建一个用户自定义对象类型的实例(例如自定义函数、构造函数)或具有构造函数内置对象(例如:String,Object等原生对象)的实例
先看一段new方法使用情景
function Person(name) {
this.name = name;
}
Person.prototype.getName = function() {
console.log(this.name)
}
let person = new Person('luck');
person.getName();//luck
那么new工作的原理是什么呢。
通过以上代码可以看到,当new一个函数的时候,会创建一个新的实例,然后将得到原函数的原型。
步骤:
1.创建一个空对象,{}
2.将执行函数的[[原型]]连接到这个对象上去
3.拿到执行构造函数
4.执行构造函数,并通过apply()方法将构造函数和参数传递过去
5.返回对象实例,如果构造函数有返回对象,则返回构造函数,否则返回this(即创建的新对象)
function new1() {
// 获取构造函数和传递的参数
let [fn, ...args] = [...arguments];
// 通过Object.create()方法创建一个构造函数实例原型引用的一个对象
let target = Object.create(fn.prototype);
// 执行构造函数
let result = fn.apply(target, args);
// 执行的构造函数若为对象或者函数则返回执行的构造函数,否则返回this(新创建的对象)
return typeof result === 'object' || typeof result === 'function' ?
result : target;
}
function Person(name) {
this.name = name;
}
Person.prototype.getName = function() {
console.log(this.name)
}
let person = new1(Person, 'nick')
person.getName(); //nick