美文网首页
Javascript 中的 __proto__ 和 protot

Javascript 中的 __proto__ 和 protot

作者: SingleDiego | 来源:发表于2019-05-31 15:03 被阅读0次




    在 JS 里,万物皆对象。方法(Function)是对象,方法的原型(Function.prototype)是对象。因此,它们都会具有对象共有的特点。

    即:对象具有属性 __proto__,可称为隐式原型。

    一个对象的隐式原型指向构造该对象的构造函数的原型,这也保证了实例能够访问在构造函数原型中定义的属性和方法。

    比如有构造函数 Person,和由该函数生成的对象 tom

    function Person(name){
      this.name = name;
    }
    
    let tom = new Person('tom');
    

    对象 tom 的隐式原型指向构造该对象的构造函数 Person 的原型:

    tom.__proto__ === Person.prototype
    // true
    
    Object.getPrototypeOf(tom) === Person.prototype
    // true
    




    方法(Function)这个特殊的对象,除了和其他对象一样有上述 _proto_ 属性之外,还有自己特有的属性 prototype

    Person.prototype
    
    // 结果
    {constructor: ƒ}
      constructor: ƒ Person(name)
      __proto__: Object
    

    这个属性是一个指针,指向一个对象,这个对象的用途就是包含所有实例共享的属性和方法(我们把这个对象叫做原型对象)。

    原型对象也有一个属性,叫做 constructor,这个属性包含了一个指针,指回原构造函数。

    Person.prototype.constructor
    
    // 结果
    ƒ Person(name){
      this.name = name;
    }
    




    我们来看看上面的图。

    1.构造函数 Foo()

    构造函数 Foo() 的原型属性 Foo.prototype 指向了原型对象 Foo.prototype

    在原型对象 Foo.prototype 里有共有的方法,所有使用构造函数 Foo() 声明的实例(这里是 f1,f2)都可以共享这个方法。

    Foo.prototype.bar = 'bar'
    f1.bar
    // "bar"
    
    2. 原型对象 Foo.prototype

    Foo.prototype 保存着实例共享的方法,有一个指针 constructor 指回构造函数。

    Foo.prototype.constructor === Foo
    // true
    
    3.实例

    f1 和 f2 是 Foo 这个对象的两个实例,这两个对象也有属性 __proto__,指向构造函数的原型对象 Foo.prototype,所以该构造函数生成的对象能够访问原型对象的所有方法。

    function Foo() {};
    f1 = new Foo();
    
    f1.__proto__ === Foo.prototype
    // true
    




    另外:

    构造函数 Foo() 除了是方法,也是对象,它也有 __proto__ 属性,指向谁呢?

    指向它的构造函数的原型对象。函数的构造函数就是 Function,因此这里的 __proto__ 指向了 Function.prototype

    Foo.__proto__ === Function.prototype
    // true
    

    其实除了 Foo()Function()Object() 也是一样的道理。

    原型对象也是对象,它的 __proto__ 属性,又指向谁呢?同理,指向它的构造函数的原型对象。这里是 Object.prototype

    最后,Object.prototype__proto__ 属性指向 null




    总结:

    1. 对象有属性 __proto__,指向该对象的构造函数的原型对象。

    2. 方法除了有 __proto__ 属性,还有 prototype 属性,prototype 指向该方法的原型对象。

    相关文章

      网友评论

          本文标题:Javascript 中的 __proto__ 和 protot

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