美文网首页
一篇就够-理解原型和原型链

一篇就够-理解原型和原型链

作者: johe_jianshu | 来源:发表于2020-03-24 19:13 被阅读0次

    prototype和proto

    prototype是原型对象,proto是原型

    prototype

    每个函数都有一个prototype属性,指向了一个对象,这个对象正是构造函数的原型对象。原型拥有constructor属性,指向当前构造函数。

    原型可以理解为,每一个js对象,在创建的时候就会与之关联另一个对象,这个对象就是原型,每个对象都会从原型继承属性。

    proto

    这个属性虽然可读可写,但是我们应该把它当做一种只读属性,在未来,该属性可能会变成不可写,尝试通过它来实现继承会造成性能问题。

    每个对象都有一个 proto 原型属性,指向了该对象构造函数的原型对象,该原型对象是该对象构造函数的Prototype。

    每个实例对象( object )都有一个私有属性(称之为 proto )指向它的构造函数的原型对象(prototype)。该原型对象也有一个自己的原型( proto ) ,层层向上直到一个对象的原型对象为 null。根据定义,null 没有原型,并作为这个原型链中的最后一个环节。

    总结来说原型链就是 proto 的链表,最终指向null。

    prototype和proto的不同点:

    • 函数在创建的时候,就拥有prototype属性,并且为其初始化为一个拥有proto属性和constructor属性的对象,constructor属性指向该函数
    • prototype是函数才有的属性,指向构造函数的原型
    • proto是任意对象都有的属性,所以函数也有
    • 任意构造函数的proto指向Function.prototype,因为任意函数的构造函数是function Function(){}
    • proto===构造函数.prototype

    说明prototype和proto

    image image
    function Foo(){
    
    }
    
    var foo1 = new Foo()
    
    console.log(foo1.__proto__ === Foo.prototype)
    
    console.log(Foo.prototype.constructor === Foo)
    
    //原型为对象,对象都是Object的实例
    console.log(Foo.prototype.__proto__ === Object.prototype)
    
    //原型链的顶端是null ,代表没有对象
    console.log(Object.prototype.__proto__ === null)
    
    //Foo也是对象,是Function构造函数的实例
    console.log(Foo.__proto__ == Function.prototype)
    
    //Function.prototype也是对象,也由Object构造函数实例化
    console.log(Function.prototype.__proto__ === Object.prototype)
    
    //Object函数也是由Function实例化
    console.log(Object.__proto__ === Function.prototype)
    
    

    真的是继承吗?
    继承意味着复制操作,然而js不会复制对象的属性,相反,只是在两个对象之间创建一个关联,这样,一个对象就可以通过委托访问另一个对象的属性和函数,所以与其叫继承,委托的说法反而更准确些。

    instanceof

    instanceof用于判断一个对象是否为构造函数的实例

    function Foo(){
    
    }
    
    var foo = new Foo()
    //true
    console.log( foo instanceof Foo)
    //true
    console.log( foo instanceof Object)
    
    

    实际上的判断逻辑:判断对象的原型链上,是否包含构造函数的prototype

    //由于原型链的顶端为null,则终止条件为null
    function instanceof(obj,func){
        let proto = obj.__proto__
        let isInstanceFlag = false
        while(proto!==null){
            if(proto===func.prototype){
                isInstanceFlag = true
                break;
            }
            proto = proto.__proto__
        }
        return isInstanceFlag
    }
    
    

    hasOwnPrototype方法或者Object.keys()

    在原型链上查找属性比较耗时,对性能有副作用,这在性能要求苛刻的情况下很重要。另外,试图访问不存在的属性时会遍历整个原型链。

    要检查对象是否具有自己定义的额属性,而不是其原型链上的某个属性,使用hasOwnProperty(Object.prototype.hasOwnProperty)方法。

    hasOwnProprty和Object.keys()不会遍历原型链上的属性。

    
    
    

    相关文章

      网友评论

          本文标题:一篇就够-理解原型和原型链

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