这一章让你了解透js中的prototype和__proto__

作者 : 开心源码 本文共1027个字,预计阅读时间需要3分钟 发布时间: 2022-05-13 共218人阅读
  • Function Array Object 这是浏览器内置的三个构造函数。 不论是函数还是数组,这些都属于对象类型

  • 其中Function这个函数没有被什么构造出来,是js引擎使用底层代码实现的,后面两者都是基于Function被Function构造出来的。

  • 记住,js中,每一个对象都是被构造函数构造出来的。就算你是直接这么写:

    • var obj = {};这样是通过new Object这个构造函数构造出来的)
    • var arr = [];这样是通过new Array这个构造函数构造出来的)
    • var func = function(){} 或者者 直接函数公告 function test(){}这样都是在内部通过new Function构造出来的)
  • 而后这些通过构造出来的对象,他们都会有一个proto属性,这个属性的属性值指向的是将这个对象构造出来的那个构造函数身上的一个属性prototype的地址,注意这个属性只有函数才有.

function  Test(){    this.xxx = xxx;    ......;}var test = new Test();
  • Test函数本身有一个prototype 这个属性的值是一个普通的对象 Test.prototype

  • test是构造出来的实例对象,身上有一个proto属性,这个属性的值为 test.proto = Test.prototype,只需创立了一个实例对象,就会有这么一个属性,指向构造函数的原型prototype

  • 而后下一个知识点,Test身上为什么也有proto呢,由于前面说了,这个函数也是对象类型,对象就肯定是由构造函数构造出来的,Test这个构造函数自然也就有proto。前面也有说过,函数都是由这个Function构造出来的。

  • 这个属性proto指向的就是Function这个构造函数的原型prtotype

  • 那么也就是说函数这个对象类型不但具备prototype属性,还有proto属性。也只有函数才有这两个属性

  • 那么之前的内置的Object,Array这两个构造函数也是满足上面这个条件的,有两个属性,proto属性也都是指向的Function的原型prototype。

image.png

image.png
最后附上一张图,助你了解原型链
image.png
这里构造函数本身的__proto__这条链就没画图了,前面也用文字详细的说过。
至此,原型和隐式原型也就讲完了,不知道大家看完之后有没有一种恍然大悟的感觉呢?欢迎大家在下方留言评论哦,如有不足之处还请各位大佬加以指正!

说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » 这一章让你了解透js中的prototype和__proto__

发表回复