JS 手写new

最近在看手写new，涉及到原型对象和隐式原型，虽然现在手写new已经不会明显地操作__proto__了，但我们还是要明白，关于原型的内容有点多，写在另一篇里面了。
先看现在的手写new的代码：

function _new(fn) {
    
    
	const obj = Object.create(fn.prototype)
	const rel = fn.apply(obj, [arguments])
	return rel instanceof Object ? rel : obj
}

先单句解析：

const obj = Object.create(fn.prototype)
这一句里面发生了如下事件：
- 创建一个空对象{}
- 空对象的 __proto__获得fn.prototype的属性和方法
- 那obj获得了什么？答案是啥都没得到，但他的__proto__得到了想要的一切
const rel = fn.apply(obj, [arguments])
- 执行fn，但此时fn内部的this指向了obj，arguments也归obj所有
- 此时fn内部的this.xxx = xxx等操作将使obj真正获得xxx属性
return rel instanceof Object ? rel : obj
- 如果rel是对象，那说明fn执行时返回了一个更完善的对象，我们就用这个（因为fn作为构造函数，极有可能自己在内部进行一番操作，比如赋值一些特殊的在Object.create阶段没赋予obj的方法，弄出一个我们真正需要的对象）
- 如果返回值为undefined，说明没有返回值，我们操作完this和参数的传递就可以直接返回obj了

这是现在比较常见的手写new方式

以前会这么写：

function _new(fn) {
    
    
	var obj = {
    
    }
	obj.__proto__ = fn.prototype
	const rel = fn.apply(obj, [arguments])
	return rel instanceof Object ? rel : obj
}

我们会发现步骤其实和上面的第一句解析一个意思。
现在我们不推荐使用__proto__了。

下一篇介绍原型。

猜你喜欢