快速搞懂『原型、原型链』【JavaScript基础专题】

掌握名称对应和它们的从属关系

  1. 对应名称
  • prototype: 原型
  • proto:原型链(原型的链接点)
  1. 从属关系
  • prototype -> 从属于函数,函数的原型属性,就是一个对象{}
  • proto ->Object的一个属性 也是一个对象{}
  • 对象的proto保存着该对象的构造函数的prototype

从属关系与原型链的基本认知

简单理解,原型链是什么? 原型链就是以一个对象为基准,以__proto__为连接的一个链条,一直到Object.prototype为止。

深入认识原型链、原型与原型链继承

举个例子 :创建一个Test函数,里面有a属性,值为1,通过Test.prototype.b=2,结果为:Test.prototype对应的__proto__也是一个对象,新增了一个b属性,值为2

这个链条长这样,顶层一直到Object.prototype 既然这样我们是否可以通过Object.prototype.c = 3增加一个c?

我们可以通过test对象之间访问到a,b,c。也就是说,我们能否访问到这些值,与是不是构造他的函数是没有关系的,也就是说并不是说我构造了你,你就只能继承我,我们可以通过原型继承,__proto__上保存了Test.prototype这个对象,这个对象里面有b...当我们在test里面找不到c的时候就会通过Test.prototype上去找,这个上面也找不到,我们就去Object.prototype上找,即:原型链可以从底层到高层一步步继承,当底层能够找到时,就不会再接着往上找了(沿着proto去找链上的任意一个原型属性,里面只要有我们要的值,就拿下来,没有就接着往上找)(原型链继承)

Function与Object的特殊性

Test底层是由Function构造来的,那么Test.proto也就全等于Function.prototype,Test的proto对应了他的原型

这里的Function的proto 全等于他的prototype是底层指定好了的

Object本身就是一个函数,因此这里他等于Function的prototype是合情合理的,据此我们就能推出

判断属性是否存在方法

hasOwnproperty方法看对象上是否有这个属性,ab本身有,c是通过继承来的

如果想看看链条上有没有呢? in

相关推荐
ynchyong8 小时前
微信小程序启动顺序遇到的一个坑
前端·微信小程序
用户233376852188 小时前
接口卡死排查实录-缺失return的UB死循环
前端·后端
光影少年9 小时前
如何实现RN 多环境、多渠道打包
前端·react native·react.js
闲坐含香咀翠9 小时前
百万行数据透视表,我是怎么把 Vue 响应式开销砍到零的
前端·vue.js·性能优化
xiaopang9 小时前
小红书小组件(miniwidget)开发实战:单页面viewState切换架构
前端
labixiong9 小时前
告别scroll 监听:CSS 滚动驱动动画,主线程堵死也仍跟手
前端·css·html
用户302822530689 小时前
别让 Agent 被 Webhook 叫醒就开工:实现一个幂等启动层
javascript
云析赢指标公式网49 小时前
文华WH6布林轨道均线强弱共振指标公式
前端·算法
许彰午10 小时前
34-安全复盘96个问题
前端·vue.js·安全
妙码生花10 小时前
PHP 各框架下和 Go 的性能比较
前端·后端·go