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"

相关推荐
IT_陈寒10 小时前
折腾一天才明白:Vite的热更新为什么偶尔会罢工
前端·人工智能·后端
AI茶水间管理员10 小时前
学习ClaudeCode源码之Agent核心循环
前端·人工智能·后端
挖稀泥的工人11 小时前
AI聊天界面的布局细节和打字跟随方法
前端·javascript·面试
竹林81811 小时前
从“连接失败”到丝滑登录:我用 ethers.js 连接 MetaMask 的完整踩坑记录
前端·javascript
颜酱11 小时前
图片大模型实践:可灵(Kling)文生图前后端实现
前端·javascript·人工智能
木斯佳11 小时前
前端八股文面经大全:腾讯CSIG实习面(2026-04-10)·面经深度解析
前端·ai·xss·埋点·实习面经
夏暖冬凉11 小时前
npm发布流程(记录遇到的问题)
前端·npm·node.js
XPoet11 小时前
AI 编程工程化:Subagent——给你的 AI 员工打造协作助手
前端·后端·ai编程
心连欣12 小时前
解锁对象遍历:当字符串遇上for...in循环
前端·javascript
Sestid12 小时前
前端Cursor使用指南(后续会更新Claude)
前端·claude·cursor