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 ...
随机推荐
- 实战派 | Java项目中玩转Redis6.0客户端缓存!
原创:微信公众号 码农参上,欢迎分享,转载请保留出处. 哈喽大家好啊,我是Hydra. 在前面的文章中,我们介绍了Redis6.0中的新特性客户端缓存client-side caching,通过tel ...
- 构建AR视频空间大数据平台(物联网及工业互联网、视频、AI场景识别)
目 录 1. 应用背景... 2 2. 系统框架... 2 3. AI场景识别算法和硬件... 3 4. AR视频空间管理系统... 5 5. ...
- 个人冲刺(四)——体温上报app(二阶段)
冲刺任务:完成用户注册功能和数据库类 RegisterActivity.java package com.example.helloworld; import android.content.Inte ...
- [2-SAT]编码
题意:给n个01字符串,每个最多包含1个'?',能否构造出满足两两不存在一个是另一个前缀的方案. 思路: 2-SAT+trie树优化建图 把每个字符串拆成i,i+n,如果不存在'?',就硬搞出两种情况 ...
- JavaSE_多线程入门 线程安全 死锁 状态 通讯 线程池
1 多线程入门 1.1 多线程相关的概念 并发与并行 并行:在同一时刻,有多个任务在多个CPU上同时执行. 并发:在同一时刻,有多个任务在单个CPU上交替执行. 进程与线程 进程:就是操作系统中正在运 ...
- POJ1821 Fence 题解报告
传送门 1 题目描述 A team of $k (1 <= K <= 100) $workers should paint a fence which contains \(N (1 &l ...
- .NET中获取Windows的常见路径
更新记录 本文迁移自Panda666原博客,原发布时间:2021年6月30日. 一.说明 每种平台都其预定义的规则,比如Windows平台有自己的规定.公司也有预定义的规章制度.那么在平台上开发和干活 ...
- mac M1 php扩展 xlswriter 编译安装爬坑记录
电脑配置 MacBook Pro(14英寸,2021年) 系统版本 macOS Monterey 12.4 芯片 Apple M1 Pro PHP环境 MAMP Pro Version 6.6.1 ( ...
- 你难道不知道Vue-cookie?
install npm install vue-cookies --save main.js import VueCookies from 'vue-cookies'Vue.use(VueCookie ...
- jenkins安装配置及发布
1. yum install -y lrzsz vim net-tools 2. 下载jdk-8u131-linux-x64.tar.gz http://www.oracle.com/technetw ...