如果你对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. .NET性能优化-使用ValueStringBuilder拼接字符串

    前言 这一次要和大家分享的一个Tips是在字符串拼接场景使用的,我们经常会遇到有很多短小的字符串需要拼接的场景,在这种场景下及其的不推荐使用String.Concat也就是使用+=运算符. 目前来说官 ...

  2. 【java并发编程】Lock & Condition 协调同步生产消费

    一.协调生产/消费的需求 本文内容主要想向大家介绍一下Lock结合Condition的使用方法,为了更好的理解Lock锁与Condition锁信号,我们来手写一个ArrayBlockingQueue. ...

  3. 手把手教你 在IDEA搭建 SparkSQL的开发环境

    1. 创建maven项目 在IDEA中添加scala插件 并添加scala的sdk https://www.cnblogs.com/bajiaotai/p/15381309.html 2. 相关依赖j ...

  4. Mac-Typora快捷键

    标题(大钢) command+(1-6)) 如:command+1,设置为一级标题 引用 快捷键:command+option+Q 或者:先">",后面直接加内容 二级引用: ...

  5. MySQL用户管理与字符集

    用户管理与字符集 一.用户管理 用户名的概念 用户名是由两部分组成的 user和host 1.1 创建用户 create user 'yysue'@'192.168.5.38' identified ...

  6. 141_Power Query之获取钉钉审批流自动刷新Power BI报告

    博客:www.jiaopengzi.com 焦棚子的文章目录 请点击下载附件 一.背景 钉钉办公给很多企业带来了很多方便,比如审批流线上化,通用化.线上化填写后,数据自动获取又是一个硬伤了,虽然数据可 ...

  7. iTextSharp 提取签名图像

    原文 本文使用 iTextSharp 5.5.13.2,记录使用 iTextSharp 提取图片时,获得的知识点. pdf 中的签名并不是单纯的一张图片,它是由一张基础的底色图和一张蒙版图片组成.需要 ...

  8. python之部分内置函数与迭代器与异常处理

    目录 常见内置函数(部分) 可迭代对象 迭代器对象 for循环内部原理 异常处理 异常信息的组成部分 异常的分类 异常处理实操 异常处理的其他操作 for循环本质 迭代取值与索引取值的区别 常见内置函 ...

  9. 2022Gartner容器预测:2025年85%的企业将使用容器管理服务

    近日,国际知名权威分析机构Gartner发布了最新<全球容器管理预测>.预测中指出:在加速的数字化转型驱动下,到2025年全球容器管理领域市场规模将突破14亿美元,预计年复合增长率将达到2 ...

  10. 在 .NET 中使用 FixedTimeEquals 应对计时攻击

    计时攻击 在计算机安全中,计时攻击(Timing attack)是旁道攻击 (Side-channel attack) 的一种,而旁道攻击是根据计算机处理过程发出的信息进行分析,包括耗时,声音,功耗等 ...