5202年了,还不懂原型链吗?

原型与原型链

画出逻辑关系图是最容易理解其中关系的方式。

解释:

  • 任何时候,只要创建了一个函数,就会为这个函数创建了一个prototype属性(指向原型对象)
  • 所有的原型对象会自动获取一个名为constructor的属性,指向与之关联的构造函数。
  • 每次用构造函数创建函数的实例,就会暴露出一个__proto__的属性,用来访问这个对象的原型。

原型层级

当访问对象属性时,会根据原型链查找,先从实例本身上查找,找不带就会去访问原型对象,直到找到为止,

当实例对象上存在一个和原型对象同名的属性, 这时实例对象上的这个属性,会遮蔽原型对象上的属性。

通过对实例使用hasOwnProperty()方法可以判断访问的是实例属性,还是原型属性。

来自实例就返回true,来自原型就返回false。

原型和in操作符

in操作符由两种使用方式 一个是单独使用。 一个是配合 for-in循环中使用。

单独使用,in操作符会在可以 通过对象访问指定属性的 返回true 。 不管是原型还是实例上

如果需要判断一个属性是否在原型上,同时使用 hasOwnProperty和in操作符判断。

js 复制代码
function hasPrototypeProperty(object, name){ 
 return !object.hasOwnProperty(name) && (name in object); 
} 

for-in循环。会通过访问对象,返回可被枚举的属性,包含实例属性和原型属性。

话术总结

面试官提问:"说一说js中原型与原型链。"

我:"当我们创建了一个函数时,就会为这个函数创建了一个prototype属性指向他的原型对象,所有的原型对象会自动获取一个名为constructor的属性,指向与之关联的构造函数。每次用构造函数创建函数的实例,就会暴露出一个__proto__的属性,用来访问这个对象的原型。由__proto__属性一直访问,最终会终止与Object.prototype。这就组成了原型链。当我们查找对象上的一个属性时,如果自身没有这个属性,就回沿着原型链继续往下查找,直到找到这个属性,并返回他的值。"

面试官提问:"666"

相关推荐
NiceCloud喜云4 小时前
Opus 4.8 的 Effort Control 怎么选:Low 到 Max 五档策略
android·java·大数据·前端·c++·python·spring
wordbaby5 小时前
React Native + RNOH:跨页面数据回传的最佳实践与避坑指南
前端·react native
丷丩5 小时前
MapLibre GL JS第22课:查看本地GeoJSON
前端·javascript·map·mapbox·maplibre gl js
Front思6 小时前
AI前端工程师需要具备能力+
前端·人工智能·ai
ZC跨境爬虫8 小时前
跟着 MDN 学CSS day_29:(掌握文本与字体样式的核心艺术)
前端·css·ui·html·tensorflow
李子琪。9 小时前
网络空间安全深度实战:CSRF 漏洞原理剖析与基于 Token 的纵深防御体系构建(全栈实验报告)
前端·安全·csrf
冰暮流星9 小时前
javascript之history对象介绍
前端·笔记
IT_陈寒9 小时前
Vite热更新失灵?你可能漏了这个配置
前端·人工智能·后端
丷丩9 小时前
MapLibre GL JS第19课:实时更新要素
前端·javascript·gis·map·mapbox·maplibre gl js
Mr.Daozhi9 小时前
RAG 进阶实战:跑通 Demo 后我连续翻了 6 次车,逐一修复才真正可用(含 Gradio Web 版)
前端·数据库·langchain·大模型·gradio·rag·科研工具