当前位置: 首页 > news >正文

图解JavaScript原型:原型链及其分析 | JavaScript图解

​​

忽略该图的细节(如内存地址值没有用二进制)
以下是对该图进一步的理解和总结

1. JS 对象概念的辨析

  • 对象是什么:保存在堆中一块区域,同时在栈中有一块区域保存其在堆中的地址(也就是我们通常说的该变量指向谁)

  • 明确 Object 也是 JS 默认执行的, 可以理解为 var Object = new Object()​ 是 JS 默认执行的

  • 明确 Function 也是对象

    可以这样理解 `var Function = new Object()` 是JS默认执行的
    
  • 明确任何一个函数也是一个对象(即我们所说的类型对象(类型对象就是用 function fn(){}​ ​创建出来的函数对象),与之对应的实例对象就是指通过调用构造方法 new 创建的对象或者说直接用{}创建的对象(本质也是调用构造函数))

    	/** 如何理解任何一个函数也是一个对象**/// 1. 函数不光可以用function关键字创建也可以用如下方法创建var fn =  new Function(); // 等同于 function fn(){}// 2. Function 也是对象,是这样来的var Function = new Object();// 3. Object() 是什么:构造方法(JS默认定义的)
    

2. JS 原型对象的辨析

  • 首先是一个对象

  • 其次在代码中表现为:有一个属性其指向这个空对象(或者说是有一个变量,该变量储存该对象的地址)

3. JS 隐式原型和显式原型的辨析

  • 显式原型:即在函数中有一个属性叫 prototype 其指向一个空的对象(或者说这个属性的值保存这个空对象的地址值),这个属性就叫做显式原型对象(或者说这个属性保存的地址,通过该地址寻找到一个对象,该对象叫做显式原型对象)

  • 隐式原型:对象中同样有一个属性叫__proto__其指向一个空的对象(或者说这个属性的值保存这个空对象的地址值),这个属性就叫做隐式原型对象(或者说这个属性保存的地址,通过该地址寻找到一个对象,该对象叫隐式原型对象)

    • 【 需要注意的是一般来说 JS 在创建对象的时候自动把__proto__指向其构造函数的 prototype(也就是说会运行如下代码 proto = prototype​) 这两个变量保存同一个空对象的地址】

通常我们会有一句话概括上面的内容:即一个对象(这里的对象是指实例对象)的隐式原型对象指向其构造函数(这里是指构造函数对象)的显式原型对象

4. Object 的原型对象中的__proto__

  • 特殊的:明确 Object 显式原型对象的__proto__(隐式原型对象)值为 null,因为不为 null 那就无限循环了(特殊情况)

5. 原型链查找

根据图以及 1-4 的铺垫,可以总结为,首先在该对象上找然后-> 找其隐式原型对象-> 一直往上找到那个__proto__为 null 的对象终止(期间找到了就返回,停止继续往上搜索)

相关文章:

  • VBA经典应用69例应用8:利用VBA,预设某个程序在晚上21点运行
  • 【Bluedroid】蓝牙启动之btm_ble_init源码分析
  • java综合项目开发一课一得
  • Linux 用户层 和 内核层锁的实现
  • 跟我学c++中级篇——多线程中的文件处理
  • 《前端面试题:JavaScript 闭包深度解析》
  • DAY 43 训练
  • Tavily 技术详解:为大模型提供实时搜索增强的利器
  • 《最短路(Dijkstra+Heap)》题集
  • 跟进一下目前最新的大数据技术
  • 《算法复杂度:数据结构世界里的“速度与激情”》
  • 【Redis/2】核心特性、应用场景与安装配置
  • Langgraph实战-自省式RAG: Self-RAG
  • 分类数据集 - 场景分类数据集下载
  • 【本地AI大模型部署+可视化界面图文教程】Ollama+Qwen3
  • Unity中的transform.up
  • 【创新算法】改进深度优先搜索算法配合二进制粒子群的配电网故障恢复重构研究
  • 嵌入式学习--江协stm32day5
  • uni-app学习笔记二十九--数据缓存
  • 【ArcGIS Pro微课1000例】0072:如何自动保存编辑内容及保存工程?
  • 怎么做网站一张图/体验式营销
  • 电商设计属于什么设计/搜索引擎优化方案案例
  • 徐州建站推广/seo顾问什么职位
  • 深圳网站建设与推广/torrentkitty磁力官网
  • 做微商哪个网站有客源/优化大师 win10下载
  • 有没有专门发布毕业设计代做网站/中国最新新闻