js中new 一个对象究竟发生了什么

一直以来,我们都知道new一个对象,但是new一个对象背后,发生了什么呢?

function Person (phone, age) {
  this.age = age;
  this.phone = phone;
  this.getPerson = function () { }
}

首先,我们定义一个Person对象,怎么使用new来定义一个实例呢?很简单:

let person = new Person("12345", 30)

这样,我们就得到了一个phone"12345",年龄为30的对象实例。
其实,这背后,发生了这样一件事:

1.创建一个 Object 对象,有两种方法

//var obj = new Object();
var obj = {}
这时候,输出这个对象,在浏览器中用`console.log()`

对象{}

我们会在浏览器中看到,obj {}的具有的属性,这其中就涉及到js中比较基础的原型链继承的知识,obj的__proto__,就是ojb的原型链是null因为已经到最顶层了。

2.让新创建的对象的 proto 变量指向 Person 原型对象空间

obj.__proto__ = Person.prototype;

继承原型链

这一步,obj已经继承到了Person对象的原型链空间,可以看到在他的prototype属性中已经有了Person对象的constructor中的属性和方法。

3.借用Person构造函数中的为 obj 对象变量增加 age 属性和 phone 属性

Person.apply(obj, ["12344", 23]);

实例化

这一步,用apply方法,已经实例化了对象。

这就是js中new一个对象背后所经历的逻辑。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容