js中new 一个对象究竟发生了什么
2022-03-15 本文已影响0人
fred_33c7
一直以来,我们都知道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一个对象背后所经历的逻辑。