JavaScript中 new 操作符可以通过构造函数创建对象,但是其底层原理大多人都不太清楚,下面我们来详解一下 new 操作符的底层原理。(PS:JavaScript有8种内置的构造函数:Object、Array、Function、Date、RegExp、Number、String、Set、Map)
首先看一下这句代码:
var obj = {};
var arr = [];
// 其实这只是JavaScript中创建对象的语法糖,本质上为
var obj = new Object();
var arr = new Array();
下面详解 new Object() 底层是如何运行的,大致分为三步,
- 创建一个空对象 {};
- 将空对象的 proto 原型对象 指向 Object.prototype;
- 将Object构造函数的this指向当前空对象
var obj;
创建空对象:{};
{}.__proto__ = Object.prototype;
Object.call({});
obj = {};
示例:
function People() {
this.name = 'phuhoang';
}
var me = new People(); // { name: 'phuhoang'}
// 其执行过程拆分为
0. var me;
1. 内存开辟空间创建空对象 {} // {}
2. {}.__proto__ = People.prototype // { __proto__: People.prototype }
3. People.call({}) // { name: 'phuhoang', __proto__: People.prototype }
4. me = { name: 'phuhoang', __proto__: People.prototype }
网友评论