盒子
盒子
文章目录
  1. 温故而知新: new一个对象到底发生了什么!
    1. 按照上面的说法, 我们来创建一个对象
    2. FBI WARNING ⚠️
    3. 总结:

javascript中的new操作符

温故而知新: new一个对象到底发生了什么!

《JavaScript高级程序设计(第三版)》 P145是这么写的:

要创建 Person 的新实例,必须使用new操作符。以这种方式调用构造函数实际上会经历以下4个步骤:
(1)创建一个新对象;
(2)将构造函数的作用域赋给新对象(因此this就指向了这个对象);
(3)执行构造函数中的代码(为这个新对象添加属性);
(4)返回新对象。

按照上面的说法, 我们来创建一个对象

构造函数:

1
2
3
function Person (name) {
this.name = name;
}

接下来我们创建一个Person:

1
2
3
4
5
6
7
8
9
10
11
function newPerson (name) {
let O = {}; // 创建一个空对象, 用来存放
Person.call(O, name) // 使用 `Function` 原型下的 `call` 方法来绑定 `this`
return O; //方法返回`O`
}
const person1 = newPerson('小李');
const person2 = new Person('小李');
person1 instanceof Person // false

person1 instanceof Person 这个尽然是 false, 仔细观察. 原来我们这个call方法只是指定了this 并没有 绑定原型, 那好办,
我们把O.__proto__ = Person.prototype 手动赋值的形式来绑定prototype

然后我们的new方法就成了下面的样子:

1
2
3
4
5
6
7
function newPerson (name) {
let O = {}; // 创建一个空对象, 用来存放
// let O = { __proto__: P.prototype }; 或者一次操作
O.__proto__ = Person.prototype; // 手动绑定原型链
Person.call(O, name) // 使用 `Function` 原型下的 `call` 方法来绑定 `this`
return O; //方法返回`O`
}

FBI WARNING ⚠️

关于直接设置`__proto__`属性的⚠️

有点牛头不对马尾, 还是提醒下把

总结:

由此可见, person1person2prototype 在同一条原型链上, 所以他们两个使用同一个构造函数构造出来.
也证实了书中自有黄金屋