zoukankan      html  css  js  c++  java
  • JS原型链

    一、原型链图示

    Foo为构造函数,foo是Foo的实例化对象,Foo.prototype是原型对象。
    __proto__属性是对象特有的,prototype属性是函数特有的。

    二、原型链的查找机制

    js规定,所有的(实例)对象都有自己的原型对象(Foo.prototype)。
    查找的顺序是:对象的原型 ==> 原型的原型 ==> 原型的原型的原型 ==> ... ==> Object.prototype ==> null
    如果一层一层查找,所有的对象的原型都会找到Object.prototype,所有的对象都继承了Object.prototype中的属性和方法。 如toString()

    三、原型链的作用

    定制所有实例对象共享的属性和方法。
    读取属性和方法的规则:

    1. js引擎会先寻找对象本身的属性和方法,如果找不到那就去原型对象上去找,如果还是找不到,就去原型的原型去找,如果直到最顶层Object.prototype还是找不到,就会返回undefined。
    2. 如果对象和它的原型都定制了同名的属性,那么优先读取对象自身的属性。
    function Foo() {};
    Foo.prototype.name = 'mm';
    var f = new Foo();
    console.log(f.age); // undefined
    f.name = 'gg'
    console.log(f.name); // gg
    console.log(Foo.prototype.name); // mm
    

    四、constructor属性

    constructor表示原型对象和构造函数之间的关联关系。
    现在我们改造一个自定义的数组对象,就可以通过prototype实现。
    我们知道原型对象的constructor是指向构造函数本身的,因此当我们改变了原型对象的指向时,要把constructor改回自定义的构造函数。以免出现引用问题。

    function myArray() {};
    myArray.prototype = Array.prototype; // 把数组的属性和方法赋值给myArray
    myArray.prototype.constructor = myArray; // 把构造器指向myArray 不改的话指向Array
    var arr = new myArray();
    arr.push(1,2,3);
    console.log(myArray.prototype.constructor === myArray); // true
    

    五、构造函数、原型对象、实例对象之间的关系

    实例对象的__proto__属性指向了原型对象。
    原型对象的constructor属性指向了构造函数。
    实例对象的constructor属性继承自原型对象的constructor,所以同样指向了构造函数。
    (说白了还是那张原型链的图。。。)

  • 相关阅读:
    mysql高级之编程优化
    高性能产品必由之路
    linux下安装xhprof
    linux下安装apc
    linux下安装vld
    python装饰器通俗易懂的解释!
    python函数基础 与文件操作
    python基础入门一(语法基础)
    iOS Keychain,SSKeychain,使用 理解 原理
    起头
  • 原文地址:https://www.cnblogs.com/buildnewhomeland/p/12769798.html
Copyright © 2011-2022 走看看