美文网首页typescript
js中new 一个对象究竟发生了什么

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

作者: fred_33c7 | 来源:发表于2022-03-15 19:21 被阅读0次

    一直以来,我们都知道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一个对象背后所经历的逻辑。

    相关文章

      网友评论

        本文标题:js中new 一个对象究竟发生了什么

        本文链接:https://www.haomeiwen.com/subject/gobydrtx.html