javascript原型链,看完这个你肯定懂了

最新推荐文章于 2022-07-28 17:00:18 发布

于丸

最新推荐文章于 2022-07-28 17:00:18 发布

阅读量246

点赞数

分类专栏： js 文章标签： javascript js原型链

本文链接：https://blog.csdn.net/Ych_cxy/article/details/103709609

版权

js 专栏收录该内容

39 篇文章 0 订阅

订阅专栏

注意看上图,下面所讲的所有都是按照这个图来的

先来分析图片的第一行,创建一个Foo函数,console.dir查看,代码如下

<script>
  function Foo(){

    }
    console.dir(Foo)
</script>

控制台查看结果
在这里插入图片描述
我们可以看到,没有实例化Foo,也就是还没有new Foo,Foo 就已经有prototype和__proto__属性,我先来解释一下,在js里有prototype就是函数,有__proto__就是对象,所以说我们所写的构造函数既是函数也是对象.constructor属性和prototype指向相反,此文不对她做过多讲解.
下面我们实例化Foo,代码如下

<script>
   function Foo(){

    }
    let f1 = new Foo()
    let f2 = new Foo()

    console.dir(f1)
    console.dir(f2)
</script>

查看控制台结果
在这里插入图片描述
可以看到Foo的实例对象,因为他们是对象啊,所以f1和f2都只有__proto__属性,并且都指向Foo的prototype属性,记住这一点实例对象的__proto__属性指向其构造函数prototype属性.

接下来我们把第一行和第二行联系起来,上文说到f1和f2的__proto__属性和Foo的prototypr属性指向的是同一个对象,那么他是谁的实例对象呢,由图可知是Object的啊,第二行Object和第一行逻辑一样,只是多了一条最右边的prototype属性,他指向的是null,所以原型链的尽头是null.
接下来总体串起来,一开始说到Foo是个对象,根据图片我们看到他是大写Function的实例对象,就连Object都是大写Function的实例对象,然而大写Function是自己的实例对象,没错你没有看错,大写Function是大写Function自己的实例对象,所以说js里万物皆对象.