实现 new
关键字
js 中在 new 的时候发生了什么
- 创建了一个新对象
- 链接到原型
- 绑定 this 指向
- 返回这个对象
在调用 new Foo()
的过程中会发生以下四件事情:
- 首先创建了一个继承自
Foo.prototype
的新对象。 - 使用指定的参数调用构造函数
Foo
,并将this
绑定到新创建的对象。new Foo
等同于new Foo()
,也就是没有指定参数列表,Foo
不带任何参数调用的情况。 - 由构造函数返回的对象就是
new
表达式的结果。如果构造函数没有显式返回一个对象,则返回步骤 1 创建的对象。 - 一般情况下,构造函数不返回值,但是用户可以选择主动返回对象,来覆盖正常的对象创建步骤
点我查看详细
js
const isFunction = (fn) => typeof fn === 'function'
const isObject = (obj) => typeof obj === 'object' && obj !== null
// 实现 `new` 关键字
function myNew(fn, ...args) {
if (typeof fn !== 'function') {
throw 'myNew function the first param must be a function'
}
const newObj = Object.create(fn.prototype) // 创建一个继承自 fn.prototype 的新对象
const result = fn.apply(newObj, args) // 将 this 指向新对象,并执行构造函数
if (isObject(result) || isFunction(result)) {
return result
}
// 构造函数返回的不是一个对象或函数时
return newObj
}
// testing
// myNew(构造函数,初始化参数)
function Ctor() {}
let c = myNew(Ctor)
console.log(c)
new 构造函数,与直接执行函数的区别是什么?