有一个一个装逼的同事,写了一段代码

function a(){}
a.__proto__.__proto__.__proto__

然后问我,下面这个玩意a.__proto__.__proto__.__proto__是啥,然后我一脸懵逼,prototype还知道一点,这个__proto__,还来三个,是个什么鬼。于是我一直不能放下这个问题,虽然我很懒,很不喜欢费脑子,但是这个坎还是过不去,最近两天研究了大半天,就有了这篇文章。
我先说出答案, 上面的值为 null。我还很负责的告诉你,下面的_a.__proto__.__proto__.__proto__也是null

function a(){}
var _a = new a();
_a.__proto__.__proto__.__proto__

先来一张非常经典的图,真的是非常经典,你看懂他,你就懂了整个世界,然后整个世界就等着你去拯救整个世界。
)

正文之前,__proto__和prototype

都谁有的问题

typeof === object的有__proto__ , null和undefined都没有
typeof === function的有__proto__和prototype

__proto__ 是什么
__proto__ 一般情况指向的是该对象的构造函数的prototype,一般情况,因为还有很二般的情况。
先来看个简单的例子, 下面的输出是true

function a(){}
var _a = new a()
console.log(_a.__proto__ === a.prototype)

那我问_a.__proto__.__proto__为什么呢,你会这么推导么,
依据上面_a.__proto__ === a.prototype,那么_a.__proto__.__proto__就等同a.prototype.__proto__ , 那么我们就再推到等于 a.prototype.constructor.prototype,然后你去一比,结果是false。

_a.__proto__.__proto__  === a.prototype.constructor.prototype
// false

几条规则
这个先不纠结, 我们先看看上图,我们先得知道或者记住这几个规则

  1. Object.prototype.__proto__ === null
    不要纠结,铁律
  2. Object.__proto__ === Function.prototype
    Object,Number, Error等等这些函数都是Function创建的,下面就说明
    这些的constructor就是Function,这里比较有意思的就是 Function.constructor也是Function。
    那就有Object.__proto__ === Function.prototype === Function.__proto__

    Object.constructor.prototype  === Function.prototype
    // true
    Function.constructor === Function
    // true

  3. Function.prototype.__proto__ === Object.prototype
    这个就是这样的设计,

    Function.prototype.constructor === Object
    // false

    进入正题

    有这几个基本东西,我们就可以来推导了。

先看下面的代码,
js 我们来推到 aaa.__proto__.__proto__.__proto__

function aaa(){}
var _aaa = new aaa()
  1. aaa.__proto__
    aaa构造函数是Function
    aaa.constructor === Function
    aaa.__proto__ === Function.prototype

  2. aaa.__proto__.__proto__
    aaa.__proto__.__proto__ === Function.prototype.__proto__
    依据 Function.prototype.__proto__ === Object.prototype
    aaa.__proto__.__proto__ www.leyouzaixian2.com=== Function.prototype.__proto__ === Object.prototype

  3. aaa.__proto__.__proto__.__proto__
    aaa.__proto__.__proto__.__proto__ === Object.prototype.__proto__
    依据 Object.prototype.__proto__ === null
    aaa.__proto__.__proto__www.yongshiyule178.com.__proto__ === null

还是上面代码,我们接着推导_aaa.__proto__.__proto__.__proto__

  1. _aaa.__proto__
    _aaa的构造函数是 aaa
    _aaa.constructor === aaa
    _aaa.__proto__ === _aaa.constructor.prototype
    _aaa.__proto__ === www.wmylpt.com/ aaa.prototype

  2. _aaa.__proto__.__proto__
    _aaa.__proto__.__proto__www.120xh.cn  === aaa.prototype.__proto__
    参考图,Foo.prototype.__proto__www.taohuayuan178.com === Object.prototype
    _aaa.__proto__.www.yigouylpt2.cn__proto__ === aaa.prototype.__proto__ === Object.protype

  3. _aaa.__proto__.__proto__.__proto__
    _aaa.__proto__.__proto__.__proto__ === Object.protype.__proto__
    依据 Object.prototype.www.wanmeiyuele.cn __proto__ === null
    _aaa.__proto__.__proto__ === null

正文延伸, 加上继承关系

我们再来看看,带继承关系的

function aaa(){}
function bbb(){}
bbb.prototype = new aaa()
var _bbb = new bbb();

bbb.__proto__.__proto__.__proto__ === null
这个没啥好说,
关键来看看 bbb.prototype.__proto__.__proto__.__proto__

  1. bbb.prototype.__proto__
    bbb.prototype.__proto__ === bbb.prototype.constructor.prototype
    bbb.prototype的原型是 aaa的实例, bbb原型的构造函数就是aaa,所以
    bbb.prototype.__proto__ === aaa.prototype

  2. bbb.prototype.__proto__.__proto__
    bbb.prototype.__proto__.__proto__ === aaa.prototype.__proto__
    参考图,Foo.prototype.__proto__ === Object.prototype
    bbb.prototype.__proto__.__proto__ === Object.prototype

  3. bbb.prototype.__proto__.__proto__
    bbb.prototype.__proto__.__proto__ .__proto__=== Object.prototype.__proto__ === null

再来看看_bbb.__proto__.__proto__.__proto__ .__proto__

  1. _bbb.__proto__
    _bbb.__proto__ === bbb.prototype
  2. _bbb.proto.proto
    _bbb.__proto__.__proto__ === bbb.prototype._proto__ === bbb.prototype.constructor.prototype === aaa.prototype
  3. _bbb.proto.proto.proto
    _bbb.__proto__.__proto__.__proto__ === aaa.prototype.__proto__
    参考图Foo.prototype.__proto__ === Object.prototype
    _bbb.__proto__.__proto__.__proto__ === aaa.prototype.__proto__ === Object.prototype
  4. _bbb.__proto__.__proto__.__proto__.__proto__
    _bbb.__proto__.__proto__.__proto__.__proto__ === Object.prototype.__proto__ === null

正文 再加量

看看如下代码

function aaa(){}
var _aaa = new aaa()function bbb(){}
bbb.prototype = new aaa();var _bbb = new bbb();function ccc(){}
ccc.prototype = new bbb()
var _ccc = new ccc()

我们再来分析_ccc的prototype__proto__,你们会说,你有完没完
,那我就不分析了,我来推断:

推断:

  1. 任何自定义的function本身,三次__proto__必然是null,也就是往上找三代
    包括Function,Object, Error等等
    Fucntion.proto 看图,依据
    Object.__proto__ === Function.prototype === Function.__proto__
    我们来推导Function.__proto__.__proto__ .__proto__
    第一步:Function.__proto__ === Function.prototype
    第二步:Function.__proto__.__proto__ === Function.prototype.__proto__ === Object.protetype
    第三步:Function.__proto__.__proto__ .__proto__ === Object.protetype.__proto__ === null
    都是Function构造出来的
    我们来测试一下ccc

    ccc.__proto__.__proto__.__proto__ === null // true

  2. 继承关系的function fn,假设继承次数为n,
    _fn = new fn();
    那么 _fn.__protot__[3 + n] === null
    _ccc应该是3+2就是5次

    _ccc.__proto__.__proto__.__proto__.__proto__.__proto__ === null // true

  3. 继承关系的function fn,假设继承次数为n
    推到 fn.prototype.__proto__[3+n-1]
    ccc应该是 4次__proto__

    ccc.prototype.__proto__.__proto__.__proto__.__proto__ === null // true

    当然上面关联的关系,就自己慢慢看吧

正文之外, class

下面的代码也是遵守规则,至于为什么,问自己喽。

class aaa {}
class bbb extends aaa{}
class ccc extends bbb{};
var _ccc = new ccc()

关于Number,Boolen, String,Function, Date, Array, RegExp等的__proto__prototype.proto`

  1. __proto__
    因为这些都是Function创建出来的函数,__proto__在函数上时就是表示构造函数的prototype,所以
    .__proto__ === .constrcutor.prototype === Function.prototype
  2. .prototype.__proto__ 这些老骨头不遵循 __proto__ 为构造函数的prototype
    在上面提到过了,Function.prototype.__proto__ === Object.prototype
    类推,这些内置的老骨头的 .prototype.__proto__ === Object.prototype

## 总结
总结, 特别需要记忆的:

  1. Object.prototype.__proto__ === null
  2. Function.prototype.__proto__ === Object.prototype
    内置Number,Boolen, String,Function, Date, Array, RegExp等一样
  3. Object.__proto__ === Function.prototype === Function.__proto__
    联系2,这些东西都是Function创建出来的
  4. Math, JSON的__ptoto__是 Object.prototype
    typeof 可以看出来这两个是object,而不是Function
  5. function a(){} 这样创建出来,没有继承关系的函数
    a.prototype.__proto__ === Object.prototype
  6. 有继承关系的function看上面的推断
  7. 对象字面量和new Object() 比如, var a ={}, b = new Object(), c = [];
    a.__proto__ === a.constructor.prototype === Object.protype
    a.__proto__.__proto__ === Object.protype.__proto__ === null
  8. 基本数据类型string,number,boolean,比如 var a = '', b=10, c= false,
    b.__proto__ === b.constructor.prototype === Number.prototype
    b.__proto__.__proto__ === Number.prototype.__proto__ === Object.prototype
    b.__proto__.__proto__.__proto__ === Object.prototype.__proto__ === null
  9. null和undefined没有__proto__

最终

  1. 看图
  2. 浏览器输入 xx.__proto__ 或者xx.prototype自己看去

有一个一个装逼的同事,写了一段代码相关推荐

  1. Java之父22年前写的一段代码,你见过吗?

    Java之父高斯林是一位加拿大的计算机天才. 他创造了伟大的编程语言--Java,在TIOBE排行榜上,Java常年排名第一. 现在这位63岁高龄的祖师爷依然战斗在编程最前线,宝刀不老. 1.Java ...

  2. 新人入职,上午写了一段代码,下午就被开除了

    1 有一个程序员,入职了一家公司,上午刚刚写下一段代码,没想到下午就有人事来通知他被开除了.  这个程序员表示很委屈.感觉这个方法,除了性能差一点,没啥别的问题呀... 2 除了获取时间以外,一位程 ...

  3. Java中有关日期的操作,昨天晚上赴约,搞到12点多才回来,今天写这一小段代码都花了一段漫长的时间,哎。。...

    Java中有关日期的操作,昨天晚上赴约,搞到12点多才回来,今天写这一小段代码都花了一段漫长的时间,哎.. 代码奉上: /** * * @param date * @return which mont ...

  4. 分享给大家一个比较装逼的小代码

    大家写完一个比较大的程序,然后让它运行时,我们都知道 .c文件在执行时是很快的,那么就不能够体现我们所写的程序是很大很复杂的,那么如何能提升这个文件的逼格呢?这时就需要借用延迟函数以及几条用来装逼的英 ...

  5. python爬取图片链接(附带一个html装逼特效)

    使用get方式获取网页文本 import re import requests #导入requests包 url = 'https://www.biaoqingbao.net/?post_type=p ...

  6. 装逼技巧:程序员如何用代码证明自己牛逼!

    本文秉承着:你看不懂是你SB,我写的代码就要牛逼. 1.单行写一个评级组件 "★★★★★☆☆☆☆☆".slice(5 – rate, 10 – rate);定义一个变量rate是1 ...

  7. 写出一段代码将链表中的两个节点位置互换位置_面试 leetcode 算法专题系列(二)—— 链表...

    前言:只照着常考题去刷题确实是一种方法.但调研之后发现自己还是考虑不周,刷题刷的不应该是题,而是解题的思路和熟练程度.于是我决定重新组织一下刷题笔记的讲解顺序,不再以面试常考题来刷.而是以面试出题频率 ...

  8. 月薪9K程序员,写完这段代码就被辞退了

    程序员头条 报道 作为一名互联网项目开发者,在工作的过程中遇到 Bug 是很正常的事情,然而有时候一些代码也是类似于 Bug 这样的存在,虽然看起来到处都是错误,可是却能正常运行! 最近有位程序员在某 ...

  9. 写出一段代码将链表中的两个节点位置互换位置_干货||链表的技巧和算法总结...

    链表的操作总结   链表反转 这是一个简单的链表操作问题,在leetcode上面有52.7%的通过率,难度是简单.但是还是想在这里基于python做一下总结,顺便总结一下链表的各种操作. 首先先看一下 ...

最新文章

  1. 读写配置文件app.config
  2. 广西互联网金融平台系列-7条奇怪的投资数据
  3. python语言属于-Python语言属于( )。_学小易找答案
  4. java设计模式之设计原则②依赖倒置原则
  5. mdb批量导入mysql_快速将 access 用的 mdb 文件导入到 mysql 里
  6. iOS KVO crash 自修复技术实现与原理解析
  7. 挖掘建模-分类与预测-回归分析-逻辑回归
  8. c语言中不带任何修饰符的浮点变量,江苏省计算机等级考试二级C语言笔试辅导题目...
  9. 大屏实时监控-2019年CSDN博客之星年度总评选(2019-02-07 13:47)
  10. 从零开始学前端:形变(小游戏:3D翻滚盒子) --- 今天你学习了吗?(CSS:Day21)
  11. RHEL4下刻录机使用--终端图形化方式
  12. ...为他们的产品痴迷,不是有兴趣,不是了解,而是痴迷
  13. 使用ts 引入组件_Cocos技术派 | TS版属性面板定义高级篇
  14. “Tara”或将于2018年5、6月与我们见面
  15. 解决全部网页木马的技巧
  16. 软件工程笔记:SQA组织与职责
  17. Android 字符串求值工具(科学计算)
  18. python3字符串详解速查,新手流泪,老手顿悟
  19. Nginx的重启命令(nginx -s reopen)
  20. Linux 的常用系统及网络命令

热门文章

  1. 不错的shell 脚本教程
  2. 常用正则表达式合集,这一篇就够了!!(含完整案例,建议收藏)
  3. php播放器隐藏播放地址,window_ASP中实现对MediaPlayer控件播放文件地址隐藏的解决方案,在播放视频时,直接查看页面 - phpStudy...
  4. 免越狱苹果群控巽风投屏中控
  5. Dijkstra(单源最短路径)
  6. Findbugs工具的使用
  7. 2022.02.22
  8. IC是否为当下风口,本科生能否入行
  9. 计算机技术与软件专业以考代评政策之我见
  10. 改善用户体验 从CDN网络加速开始