美文网首页前端开发前端Web前端之路
一分钟秒杀,js原型与原型链

一分钟秒杀,js原型与原型链

作者: 熊师傅 | 来源:发表于2017-10-10 17:34 被阅读186次

    有人说作者吹牛逼,我特么几年没搞懂的东西。一分钟理解原型,原型链?扯犊子吧?
    说实话,原型和原型链这个东西,无非就是两个单词 prototype 和 __proto__,真的不难,虽然到今天一直是看了忘,忘了看,放下点和产品斯逼的时间,彻底把这玩意弄清楚了。

    prototype 和 __proto__的概念

       1.prototype是函数特有的属性(对象是没有的!)
       2.__proto__是对象拥有的内置属性 (function 是没有的!)
    

    看到这里,已经把以前的疑惑解开了一半,有没有?

    new的过程

    var Person = function(){};
    var p = new Person();
    

    new的过程拆分成以下三步:

    (1) var p={}; 也就是说,初始化一个对象p
    (2) p.__proto__ = Person.prototype;
    (3) Person.call(p); 也就是说构造p,也可以称之为初始化p
    

    举个例子

    var Person = function(){};
    Person.prototype.sayName = function() {
        alert("My Name is Jacky");
    };
    
    Person.prototype.age = 27;
    var p = new Person();
    p.sayName();
    

    p是一个引用指向Person的对象。我们在Person的原型上定义了一个sayName方法和age属性,当我们执行p.age时,会先在this的内部查找(也就是构造函数内部),如果没有找到然后再沿着原型链向上追溯。

    这里的向上追溯是怎么向上的呢?这里就要使用__proto__属性来链接到原型(也就是Person.prototype)进行查找。最终在原型上找到了age属性。

    PS:如果此文对你有任何的启发或者收获,请不吝手中的 关注,任何疑问留言陪撕。

    相关文章

      网友评论

        本文标题:一分钟秒杀,js原型与原型链

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