快速搞懂『原型、原型链』【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

相关推荐
道清茗17 分钟前
【shell编程知识点汇总】第九章 HTML 清洗、多行合并与条件替换
前端·html
噢,我明白了1 小时前
表单的完整 CRUD 练习【极简个人记账本】(含前端后端链接mySQL)
java·前端·数据库·mysql
幽络源小助理1 小时前
MacCMSPro版视频影视系统源码_全开源高可用视频平台解决方案
前端·php·php源码
不会敲代码18 小时前
手写 Zustand:三十分钟带你搞懂状态管理库的核心原理
前端·javascript·源码
神奇的程序员8 小时前
重构了自己5年前写的截图插件
前端·javascript·架构
橙淮8 小时前
从优化到安全再到未来 ——JavaScript 全维度技术指南
javascript
晓杰'8 小时前
从0到1实现 Balatro 游戏后端(2):NestJS框架搭建与项目结构设计
后端·websocket·typescript·node.js·游戏开发·项目实战·nestjs
UXbot9 小时前
一人独立交付 UI + 前端:AI 驱动 UI 设计工具的五大功能模块深度评测
前端·低代码·ui·设计模式·交互
kobesdu9 小时前
【ROS2实战笔记-19】ROS2 生命周期节点的启动顺序、状态转换陷阱与热备方案
java·前端·笔记·机器人·ros·ros2
诚实可靠王大锤9 小时前
React Native 输入框与按钮焦点冲突解决方案(rn版本0.70.3)
前端·javascript·react native·react.js