说说 JS 中的 new 操作到底做了些什么？

 关注

发布于: 2020 年 07 月 01 日

写在前面今天学习过程中遇到了一个题，题目要求给出打印的值，代码如下：
function Person(name) {
    this.name = name;
    console.log(this.name);
}
var a = new Person('小岛工程师');
console.log(a);
可以先思考一下输出的值是什么，也可以动手执行一下看看结果
﻿
答案如下：
小岛工程师
Person {name: "小岛工程师"}
﻿
当看到 console.log(new Person('小岛工程师')) 这段代码的时候，我在疑惑， new() 到底会返回什么呢，虽然执行一下是可以看到结果，但是不知道背后的原理就难以举一反三。正因为这个原因，也就有了接下来的探索。
﻿
new 做了什么官方定义new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。new 关键字会进行如下的操作：
创建一个空的 JS 对象
链接该对象到另一个对象
将步骤一新创建的对象作为 this 的上下文
如果该函数没有返回对象，则返回 this
﻿
看完 MDN 上的概念后，似懂非懂，接下来还是实战感受一下，看看到底发生了什么。
模拟实现
function mockNew(construct, ...args) {
  const obj = {};
  obj.__proto__ = construct.prototype;
  const res = construct.apply(obj,args);
  return res instanceof Object ? res : obj;
}
function Person(name) {
    this.name = name;
    console.log(this.name);
}
var a = new Person('小岛工程师');
console.log(a);
var b = mockNew(Person,'小岛工程师')
console.log(b);
﻿

发布于: 2020 年 07 月 01 日阅读数: 38

原文链接:【http://xie.infoq.cn/article/7616ce212477ee5a62bf66e54】。

小岛工程师

 关注

公众号：小岛工程师 2019.01.14 加入

一枚前端工程师

发布

暂无评论