如果你对javascript的原型链还有任何疑问,请看这篇文章

进入主题

前言

  1. 原型链的规则不百分百适用于所有情况
  2. 显式原型:prototype,是一个对象{}
  3. 隐式原型:__proto__,是一个对象的属性

原型链规则

  1. 任何一个引用类型的对象都有一个__proto__属性指向它的构造函数的prototype(也就是构造函数的原型对象,注意原型对象是一个{}类型)
  2. 只有函数类型的对象才有prototype属性,该属性的属性值指向该函数的原型对象。
  3. 当对象上不存在要寻找的属性或方法时,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的原型链那些事的更多相关文章

  1. JavaScript的原型链继承__propt__、prototype、constructor的理解、以及他们之间相互的关系。

    回想自己已经工作了有一段时间了,但是自己对JavaScript的原型链.和继承的理解能力没有到位,最近他们彻底的整理并且复习了一遍. 本案例中部分文案来自网络和书籍,如有侵权请联系我,我只是把我的理解 ...

  2. Javascript的原型链图

    90%的前端或者js程序员或者老师们对Javascript懂得不比这个多 给手机看的 但是这个图里的所有褐色单向箭头链就是Javascript的原型链(颜色标注对理解js原型链很关键) 这图中的各个_ ...

  3. javaScript系列 [04]-javaScript的原型链

    [04]-javaScript的原型链 本文旨在花很少的篇幅讲清楚JavaScript语言中的原型链结构,很多朋友认为JavaScript中的原型链复杂难懂,其实不然,它们就像树上的一串猴子. 1.1 ...

  4. javascript prototype原型链的原理

    javascript prototype原型链的原理 说到prototype,就不得不先说下new的过程. 我们先看看这样一段代码: <script type="text/javasc ...

  5. javaScript(原型链)

    在了解javaScript的原型链之前,我们得先来看一下原型是什么. 在javaScript中,所有的函数都会有着一个特别属性:prototype(显示原型属性):当我们运行如下代码时: functi ...

  6. 理解JavaScript的原型链

    1. 什么是对象 在JavaScript中,对象是属性的无序集合,每个属性存放一个原始值.对象或函数. 1.1 创建对象 在JavaScript中创建对象的两种方法: ① 字面上: var myObj ...

  7. JavaScript扩展原型链浅析

    前言 上文对原型和原型链做了一些简单的概念介绍和解析,本文将浅析一些原型链的扩展. javaScript原型和原型链 http://lewyon.xyz/prototype.html 扩展原型链 使用 ...

  8. JavaScript中原型链的那些事

    引言 在面向对象的语言中继承是非常重要的概念,许多面向对象语言都支持两种继承方式:接口继承和实现继承.接口继承制只继承方法签名,而实现继承继承实际的方法.在ECMAScript中函数没有签名,所以EC ...

  9. 深入浅出JavaScript之原型链&继承

    Javascript语言的继承机制,它没有"子类"和"父类"的概念,也没有"类"(class)和"实例"(instanc ...

随机推荐

  1. kNN-识别手写数字

    最后,我们要进行手写数字分类任务,但是现在我们是用kNN算法,可能会比较慢 首先,完整地看完2.3.1和2.3.2的内容,然后找到trainingDigits和testDigits文件夹,大致浏览下 ...

  2. Centos7部署Redis集群

    Redis简介 Redis(Remote Dictionary Server)是完全开源的.遵守BSD协议的.高性能的Key-Value数据库. Redis与其他Key-Value缓存产品有一下三个特 ...

  3. 渗透:winpcap

    winpcap(windows packet capture)是windows平台下一个免费,公共的网络访问系统.开发winpcap这个项目的目的在于为win32应用程序提供访问网络底层的能力.它提供 ...

  4. 767. Reorganize String - LeetCode

    Question 767. Reorganize String Solution 题目大意: 给一个字符串,将字符按如下规则排序,相邻两个字符一同,如果相同返回空串否则返回排序后的串. 思路: 首先找 ...

  5. 虚拟环境与django版本与视图层相关知识

    目录 虚拟环境 django版本区别 视图函数返回值 JsonResponse对象 form表单上传文件 request方法 FBV与CBV CBV源码剖析 模板语法传值 传值方式 传值范围 虚拟环境 ...

  6. typora的下载和基本的使用

    目录 typora的下载和基本的使用 typora的下载 typora基本的使用 选择自己喜爱的主题 创建标题 进入编程环境 改变文本样式 插入链接 插入图片 有序列表 无序列表 创建表格 单选框 表 ...

  7. 【Java面试】如何中断一个正在运行的线程?

    一个去京东面试的工作了5年的粉丝来找我说: Mic老师,你说并发编程很重要,果然我今天又挂在一道并发编程的面试题上了. 我问他问题是什么,他说:"如何中断一个正在运行中的线程?". ...

  8. syc-day2

    第1题:mod注意负数. 第2题:dp 第3题:构造(奇偶性) 第4题:线段树

  9. Mac 睡眠唤醒 不睡眠 问题

    问题 之前一直有夜晚睡觉前电脑关机的习惯,主要是想着电脑也跟人一样️要休息.然后最近想着自己 Mac 干脆每天睡眠算了,省得每天开关机麻烦,所以就最近这段时间每次夜晚睡觉前主动去点了电脑的 「Slee ...

  10. Similarity calculation

    推荐算法入门(相似度计算方法大全) 一.协同过滤算法简介 在推荐系统的众多方法之中,基于用户的协同过滤是诞最早的,原理也比较简单.基于协同过滤的推荐算法被广泛的运用在推荐系统中,比如影视推荐.猜你喜欢 ...