javascript的原型链那些事
如果你对javascript的原型链还有任何疑问,请看这篇文章
进入主题
前言
- 原型链的规则不百分百适用于所有情况
- 显式原型:prototype,是一个对象{}
- 隐式原型:__proto__,是一个对象的属性
原型链规则
- 任何一个引用类型的对象都有一个__proto__属性指向它的构造函数的prototype(也就是构造函数的原型对象,注意原型对象是一个{}类型)
- 只有函数类型的对象才有prototype属性,该属性的属性值指向该函数的原型对象。
- 当对象上不存在要寻找的属性或方法时,js会顺着隐式原型找当前对象的构造函数的显示原型对象上是否存在需要的属性或方法,如果仍然没有,会一直想上找,直到碰到null结束。
关键说明
const dad = function(){}
const instance = new dad()
根据规则,很容易得出下面两条结论:
- dad为函数类型,所以dad上存在prototype属性,属性值为一个对象,我们称它为dad的原型对象
- instance为dad的一个实例,是对象类型,因此instance上面会有一个__proto__属性,属性值为dad.prototype
接下来思考,dad.prototype也是一个对象类型,对象类型是由Object()构造函数构造出来的,dad是引用类型,所以也有一个隐式原型属性,那么我们应该也能得出下面的结论:
- dad.prototype.__proto__ === Object.prototype
- dad.__proto__ === Function.prototype
Okay,按照规则接着向上走,那么会得到以下结论:
- Object.prototype.__proto__ === Object.prototype
- Function.prototype为对象类型
但是,上面的结论不正确了,因为Object函数与Function函数比较特殊,不遵守我们总结的规则。那么他们应该等于什么呢?
- Object.prototype.__proto__ === null
- Function.prototype为[native code]的底层函数,用于javascript构建初始函数
- Function.prototype.__proto__ === Object.prototype
- Function.__proto__ === Funtion.prototype
可以看出,js让Object构造函数的原型对象的隐式原型最终指向null,否则会造成循环引用死循环。这样顺着原型链找最后一定会走到终点null;对于Function,它的构造函数是它本身,所以Function的原型对象和隐式原型相等。除此之外js让Function的原型对象的隐式原型也指向Object构造函数的原型对象,这样终点也会走到null。
结尾
到此,整个原型链全部走通,下面放出一张简单的图解,帮助理解生硬的文字。如果还有什么问题,可以发表评论,互相交流。
javascript的原型链那些事的更多相关文章
- JavaScript的原型链继承__propt__、prototype、constructor的理解、以及他们之间相互的关系。
回想自己已经工作了有一段时间了,但是自己对JavaScript的原型链.和继承的理解能力没有到位,最近他们彻底的整理并且复习了一遍. 本案例中部分文案来自网络和书籍,如有侵权请联系我,我只是把我的理解 ...
- Javascript的原型链图
90%的前端或者js程序员或者老师们对Javascript懂得不比这个多 给手机看的 但是这个图里的所有褐色单向箭头链就是Javascript的原型链(颜色标注对理解js原型链很关键) 这图中的各个_ ...
- javaScript系列 [04]-javaScript的原型链
[04]-javaScript的原型链 本文旨在花很少的篇幅讲清楚JavaScript语言中的原型链结构,很多朋友认为JavaScript中的原型链复杂难懂,其实不然,它们就像树上的一串猴子. 1.1 ...
- javascript prototype原型链的原理
javascript prototype原型链的原理 说到prototype,就不得不先说下new的过程. 我们先看看这样一段代码: <script type="text/javasc ...
- javaScript(原型链)
在了解javaScript的原型链之前,我们得先来看一下原型是什么. 在javaScript中,所有的函数都会有着一个特别属性:prototype(显示原型属性):当我们运行如下代码时: functi ...
- 理解JavaScript的原型链
1. 什么是对象 在JavaScript中,对象是属性的无序集合,每个属性存放一个原始值.对象或函数. 1.1 创建对象 在JavaScript中创建对象的两种方法: ① 字面上: var myObj ...
- JavaScript扩展原型链浅析
前言 上文对原型和原型链做了一些简单的概念介绍和解析,本文将浅析一些原型链的扩展. javaScript原型和原型链 http://lewyon.xyz/prototype.html 扩展原型链 使用 ...
- JavaScript中原型链的那些事
引言 在面向对象的语言中继承是非常重要的概念,许多面向对象语言都支持两种继承方式:接口继承和实现继承.接口继承制只继承方法签名,而实现继承继承实际的方法.在ECMAScript中函数没有签名,所以EC ...
- 深入浅出JavaScript之原型链&继承
Javascript语言的继承机制,它没有"子类"和"父类"的概念,也没有"类"(class)和"实例"(instanc ...
随机推荐
- 异步编程利器:CompletableFuture
一.一个示例回顾Future 一些业务场景我们需要使用多线程异步执行任务,加快任务执行速度. JDK5新增了Future接口,用于描述一个异步计算的结果.虽然 Future 以及相关使用方法提供了异步 ...
- 斯坦福NLP课程 | 第12讲 - NLP子词模型
作者:韩信子@ShowMeAI,路遥@ShowMeAI,奇异果@ShowMeAI 教程地址:http://www.showmeai.tech/tutorials/36 本文地址:http://www. ...
- 39. Combination Sum - LeetCode
Question 39. Combination Sum Solution 分析:以candidates = [2,3,5], target=8来分析这个问题的实现,反向思考,用target 8减2, ...
- C# 通关手册(持续更新......)
String 常用静态方法 string.Compare(string str1,string str2,bool ignoreCase) 按照字典顺序比较字符串 当str1 > str2时,返 ...
- VB.net使用Microsoft.Office.Interop.Excel对Excel进行简单的读取和写入
环境:Visual Stadio 2017 .NET Framework 4.6.1 1.直接进入正题,新建一个控制台程序,右键引用-管理Nuget程序包,搜索Microsoft.Office.In ...
- GoF的23种设计模式的功能
GoF的23种设计模式的功能 前面说明了 GoF 的 23 种设计模式的分类,现在对各个模式的功能进行介绍. 单例(Singleton)模式:某个类只能生成一个实例,该类提供了一个全局访问点供外部获取 ...
- Training loop Run Builder和namedtuple()函数
namedtuple()函数见:https://www.runoob.com/note/25726和https://www.cnblogs.com/os-python/p/6809467.html n ...
- 谷歌浏览器Chrome官方下载地址
经常看到朋友的电脑上安装是魔改的谷歌浏览器.这里将谷歌浏览器官方的下载地址放在这里.有需要的朋友可以自己去下载. 下载地址 Chrome最新稳定在线安装版:https://www.google.cn/ ...
- CSS 网页字体最佳实践
一般在网页的字体设置中,可以将字体分类三类: 系统字体:使用系统自带的字体 兜底字体:当系统字体无法正常使用,而兜底的字体 Emoji 字体:显示网页中的表情字体 为了满足不同平台,以及 Emoji ...
- 【Redis】字典
Redis 字典 基本语法 字典是Redis中的一种数据结构,底层使用哈希表实现,一个哈希表中可以存储多个键值对,它的语法如下,其中KEY为键,field和value为值(也是一个键值对): HSET ...