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

Javascript 原型链

先来一张图看看几个名词的关系 构造函数、原型、实例

徒手实现原型链

原谅我的狂草字体,我手写比用电脑画快。

今天我们只说原型链,所以接下来我就围绕着原型链的几个部分说起。

这个大家都很熟悉了,首字母大写的函数我们都可以作为构造函数,不是说小写的就不能new,也是可以的,暂时说成约定俗成吧!

        // 构造函数
        function Fn() {}
        //原型对象
        console.log(Fn.prototype)
          //new
        let fn = new Fn() 
        //实例
        console.log(fn)

代码部分结束了,今天我们就用这4行代码描述一下上图也就是原型链的来龙去脉。

每个函数都有一个属性prototype,借用**Function.prototype** 属性存储了 Function 的原型对象。

原型对象

验证了我草图构造函数.prototype指向原型对象

完整的log看一下
完整log
实例.__proto__也指向原型对象

从log里也能看出来

constructor指向构造函数
实例原型的constructor指向构造函数

最后再说构造函数 new关键字生成实例

手绘图说完了,我们说正题 原型链,为什么再说原型链之前先画了一个草图,为了帮助预热理解。

每一个原型对象都有一个__proto__属性,这个是我们在代码中继承的关键,也是众多面试官所问的什么是原型链

__proto__

上图可以看到,第一次__proto__找到了原型对象,第二次__proto__找到了Object实例对象,第三次null查找结束。

我们平时开发中用到了__proto__去查找链条中我们继承的方法和属性都在prototype(原型)上,所以不能在Fn.prototype = xxx操作,这样链条就会中断,只能在原型上扩展属性。

明天继续聊继承!

欢迎吐槽!

相关文章:

  • 交换综合实验一
  • Hanlp分词之CRF中文词法分析详解
  • 急速 debug 实战一(浏览器-基础篇)
  • kubernetes系列07—Pod控制器详解
  • SSH 免密登录
  • Java内存模型JMM 高并发原子性可见性有序性简介 多线程中篇(十)
  • vivo Z3i标准版评测 强劲配置带来酣畅体验
  • PAT A1120
  • 都是 HBase 上的 SQL 引擎,Kylin 和 Phoenix 有什么不同?
  • 2019年web前端发展趋势预测(附web前端视频教程全集)
  • 理清楚Vue的结构
  • 阿里云ACE认证之理解CDN技术
  • 数据分析沙龙杭州站,邀您报名!
  • 利用Qrcode生成二维码
  • Java到底能干嘛?
  • ES6指北【2】—— 箭头函数
  • 30秒的PHP代码片段(1)数组 - Array
  • CentOS从零开始部署Nodejs项目
  • extract-text-webpack-plugin用法
  • HTTP中GET与POST的区别 99%的错误认识
  • javascript从右向左截取指定位数字符的3种方法
  • JDK9: 集成 Jshell 和 Maven 项目.
  • JS实现简单的MVC模式开发小游戏
  • PHP的Ev教程三(Periodic watcher)
  • react 代码优化(一) ——事件处理
  • 大数据与云计算学习:数据分析(二)
  • 记一次和乔布斯合作最难忘的经历
  • 原创:新手布局福音!微信小程序使用flex的一些基础样式属性(一)
  • 自定义函数
  • MiKTeX could not find the script engine ‘perl.exe‘ which is required to execute ‘latexmk‘.
  • Java性能优化之JVM GC(垃圾回收机制)
  • LevelDB 入门 —— 全面了解 LevelDB 的功能特性
  • Spring Batch JSON 支持
  • 函数计算新功能-----支持C#函数
  • # 20155222 2016-2017-2 《Java程序设计》第5周学习总结
  • (14)Hive调优——合并小文件
  • (Note)C++中的继承方式
  • (剑指Offer)面试题41:和为s的连续正数序列
  • (十六)串口UART
  • (转)fock函数详解
  • .h头文件 .lib动态链接库文件 .dll 动态链接库
  • .net 写了一个支持重试、熔断和超时策略的 HttpClient 实例池
  • .net开源工作流引擎ccflow表单数据返回值Pop分组模式和表格模式对比
  • .NET企业级应用架构设计系列之开场白
  • .NET微信公众号开发-2.0创建自定义菜单
  • .NET中GET与SET的用法
  • [23] 4K4D: Real-Time 4D View Synthesis at 4K Resolution
  • [Android Pro] listView和GridView的item设置的高度和宽度不起作用
  • [Android]使用Android打包Unity工程
  • [AX]AX2012 R2 出差申请和支出报告
  • [BUUCTF]-Reverse:reverse3解析
  • [BZOJ 1032][JSOI2007]祖码Zuma(区间Dp)
  • [C# WPF] 如何给控件添加边框(Border)?
  • [C#]C# winform部署yolov8目标检测的openvino模型
  • [js]- 两个对象的合并(Object.assign)