90%的前端或者js程序员或者老师们对Javascript懂得不比这个多

给手机看的

但是这个图里的所有褐色单向箭头链就是Javascript的原型链(颜色标注对理解js原型链很关键)

这图中的各个__proto__ constructor .prototype 都是内部对象 这样画是为了简洁

举个例子 如果考虑__proto__ 作为内部对象 上图变为

原型链就是


constructor 和 prototype如果作为内部对象 放到相应的位置 图就变大麻团了 保证晕倒什么也记不住

不服请看 这是实际的Javascript原型链图 嘿嘿

原型链大部分时候是不可见的(__proto__在firefox nodejs中可见)那么图退化为

上几图三特点

1.所有对象都在原型链上

2.除了null 每个对象都有且唯一的__proto__原型对象

3.除了null, Object.prototype,其它对象的原型对象虽然不可通过.__proto__操作访问 但是通过原型链上某个构造器(函数)的prototype属性都可以访问到

js coder大多时候要面对的是

优雅了吧 :-()

所有javascript重度编码都是操作上面这个图的元素 但是你心里至少要有下图

如果连这图都嫌弃不好记 最简单的铁三角 javascript 99%的幻化都由此来

阴影的部分不要动(当然你愿意发大招搞出个Kavascript也是个人自由 但那不是Javascript) 会破坏原型链的结构和密封性 js编程对原型链的拆改都是针对左下角的非阴影部分

考虑到__proto__ prototype constructor都是内部对象

所以实际的关系图应该是

Javascript的原型链图的更多相关文章

  1. javascript prototype原型链的原理

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

  2. javaScript(原型链)

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

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

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

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

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

  5. 理解JavaScript的原型链

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

  6. JavaScript扩展原型链浅析

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

  7. javascript的原型链那些事

    如果你对javascript的原型链还有任何疑问,请看这篇文章 进入主题 前言 原型链的规则不百分百适用于所有情况 显式原型:prototype,是一个对象{} 隐式原型:__proto__,是一个对 ...

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

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

  9. Javascript的原型链与继承

    目录 1. ES5最经典的寄生组合式继承图 2. ES5和ES6的继承 Javascript语言的继承机制,它没有"子类"和"父类"的概念,也没有"类 ...

随机推荐

  1. 搭建高可用的rabbitmq集群 + Mirror Queue + 使用C#驱动连接

    我们知道rabbitmq是一个专业的MQ产品,而且它也是一个严格遵守AMQP协议的玩意,但是要想骚,一定需要拿出高可用的东西出来,这不本篇就跟大家说 一下cluster的概念,rabbitmq是erl ...

  2. Usual tiny skills & solutions

    Ubuntu and Win10 - double OS 2016-02-21 Yesterday I helped my friend install Ubuntu (14.04 LTS) on h ...

  3. kettle中全局变量的设置

    设置全局变量. 找到.properties文件: 在文件中设置值: 在kettle中新建一个job(不用做任何设置): 转换中获取便元的设置: 重启kettle的执行结果:

  4. Python元组

    Python的元组与列表类似,不同之处在于元组的元素不能修改. 元组使用小括号,列表使用方括号. 元组创建很简单,只需要在括号中添加元素,并使用逗号隔开即可. 如下实例: tup1 = ('physi ...

  5. 两年来的core折腾之路几点总结,附上nginx启用http2拿来即用的配置

    序:一年多没更新博客园的内容了,core已经发生了翻天覆地的变化,想起2014年这时候,我就开始了从当时还叫k的那套preview都不如的vnext搭建这套系统,陆陆续续它每一次升级,我也相应地折腾, ...

  6. Intellij IDEA 快捷键

    Ctrl+Shift + Enter,语句完成 "!",否定完成,输入表达式时按 "!"键 Ctrl+E,最近的文件 Ctrl+Shift+E,最近更改的文件 ...

  7. R - MQ

    1. rabbit MQ 安装 Rabbit MQ 是建立在强大的Erlang OTP平台上,因此安装Rabbit MQ的前提是安装Erlang.通过下面两个连接下载安装3.2.3 版本: 下载并安装 ...

  8. vim编辑强制退出

    quit!命令可以进行强制退出 在修改文件时注意他的权限, ls -l:查看当前目录下的所有文件的详细信息

  9. 锋利的jquery-读书笔记(一)

    最近转职做前端,学了两个月目前学到jquery的部分,看的是<锋利的jquery>这本书,特地开了博客将自己学习过程中看到的一些知识做一个笔记. 第一章: 一.jQuery对象和DOM对象 ...

  10. windows 10专业版14393.447 64位纯净无广告版系统 基于官方稳定版1607制作 更新于20161112

    系统特点: 447更新日志(Win10 PC一周年更新正式版14393.447 32位/64位更新补丁KB3200970下载 Flash补丁Kb3202790下载): 1.通过网友的反馈,保留了Edg ...