当前位置: 首页 > Web前端 > CSS

简单描述一下什么是原型链,它的用途是什么?如果我想访问一个对象的原型,我应该使用什么方法?

时间:2023-03-31 00:29:57 CSS

这里是修真学院的前端小教室。每篇文章分享自【背景介绍】【知识分析】【常见问题】【解决方案】【编码实践】【扩展思考】【更多讨论】【参考文献】八篇深入剖析前端这方面的知识/技能,本文分享的是:【简述什么是原型链,有什么用?如果我想访问一个对象的原型,我应该使用什么方法?]1.背景介绍原型链是一种机制,意思是每一个JavaScript对象,包括原型对象,都有一个内置的[[proto]]属性指向创建它的函数对象的原型对象,即,原型属性。2、知识分析我们知道JS是有对象的,比如varobj={name:'obj'}我们可以对obj进行一些操作,包括“读取”属性、“添加”属性、“更新”属性、“删除”“属性。下面我们主要来看一下“读取”和“添加”属性。为什么会有VALUEOF/TOSTRING属性?在我们对obj进行任何其他操作之前,我们发现obj已经有了几个属性(方法)。那么问题来了:valueOf/toString/constructor是怎么来的?我们没有给obj.valueOf赋值。要弄清楚VALUEOF/TOSTRING/CONSTRUCTOR是怎么来的,你需要使用CONSOLE.DIR。我们发现console.dir(obj)的结果是:obj本身有一个属性name(这是我们给它加上的)obj还有一个属性叫做__proto__(它是一个对象)obj.__proto__有很多属性,包括valueOf、toString、constructor等obj.__proto__其实还有一个属性叫proto(console.log不显示),值为null现在回到我们的问题:为什么obj会有valueOf/toString/constructor这些属性?答:这个和proto有关。当我们“读取”obj.toString时,JS引擎会进行如下操作:查看obj对象本身是否有toString属性。如果没有,请转到下一步。看obj.__proto__对象有没有toString属性,发现obj.__proto__有toString属性,于是找到了。所以obj.toString其实就是第2步找到的obj.__proto__.toString。可以想象,如果obj.__proto__不可用,那么浏览器会继续查看obj.__proto__.__proto__,如果obj.__proto__.__proto__不可用,那么浏览器会继续查看obj.__proto__.__proto__.proto__,直到发现toString或proto为null。3.常见问题访问对象原型的方法有哪些?4、解决方案获取实例对象obj的原型对象有3种方法。obj.__proto__obj.constructor.prototypeObject.getPrototypeOf(obj)以上三种方法中,前两种不太靠谱。最新的ES6标准规定__proto__属性只需要在浏览器中部署,其他环境不需要部署。并且obj.constructor.prototype在手动更改原型对象时可能会失效。5.编码实践6.扩展思维原型链是如何产生的?引自知乎【写代码的苏打蛋糕】专栏:JavaScript世界万物的诞生7、参考文献参考1:阮一峰:Javascript继承机制的设计思想参考2:zhangjiahao8961:JavaScript原型与原型链详解参考3:JavaScriptWorldTheBirththingofEverything》我们相信人人都可以成为工程师,现在就开始,找个师兄指导你入门,学习的路上不再迷茫,这里是技能树。IT修真学院:http://www.jnshu.com,初学者转互联网行业聚集地。欢迎加入IT交流群565734203与大家一起探讨交流