Javascript-new 关键字的具体实现
文章目录

## new 关键字做了什么操作

1. 创建一个空对象 obj
1. 构造函数中的 this 指向这个新对象 obj

  • 构造函数中会有一些  this.a = a ,  这样就可以将传入的 a 通过 this 传给这个新对象, 通过操作 this 给 obj 添加属性
    1. 连接 prototype, 设置 obj 的 __proto__ 指向构造函数的 prototype
    * 所以修改 prototype 可以影响到所有的实例
    1. 如果构造函数没有额外返回, 那么返回以上步骤处理过的 obj
  • 如果 return {}return nullreturn 1return true 就不会返回上述处理过的 obj 了

代码示例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
/* --------------------------------------------- */
/* 这里定义了一个 Person */
function Person(age) {
this.age = age;
}

/* --------------------------------------------- */
/* 下面来模拟 const x = new Person() */
/* --------------------------------------------- */

/* 这里传进来一个 fn, fn 就会传入我们希望初始化的 Person 函数 */
function myNew(fn, args) {
/* 步骤1: 定义一个空 object */
let obj = {};

/* 步骤2: 将我们想要初始化的方法的 prototype 传给 新定义的 object 的 __proto__ */
obj.__proto__ = fn.prototype;

/* 步骤3: 把参数传递到 */
let r = fn.call(obj, ...args);

/* 最终如果 fn 调用后没有返回值则返回 obj */
return typeof r === "object" ? r : obj;
}

/* --------------------------------------------- */
/* 下面来模拟 const x = new Person() */
/* --------------------------------------------- */

let kid1 = new Person(10);

console.log(kid1);
console.log(kid1.age); // 输出 10

let kid2 = myNew(Person, [10]);

console.log(kid2);
console.log(kid2.age); // 输出 10