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. 基于IIS构建Pyathon Web服务

    本文简单叙述了在Windows下,如何利用IIS构建Python Web服务. 其主要步骤如下: 1.在IIS下构建一个站点,如图: 2.配置Python文件的处理程序,如图: 3.最后,在对应站点根 ...

  2. 理解Docker(7):Docker 存储 - AUFS

    (1)Docker 安装及基本用法 (2)Docker 镜像 (3)Docker 容器的隔离性 - 使用 Linux namespace 隔离容器的运行环境 (4)Docker 容器的隔离性 - 使用 ...

  3. 使用DFA做文本编辑器的自动提示

    之前看龙书的时候,龙书提到可以在编译器里用动态的生成的NFA自动机来动态匹配自己的输入串,NFA的简单实现其实写起来非常简单,但是我是实际凭感觉写完之后,却觉得并不是非常的好用,在处理自己已经输入过的 ...

  4. BZOJ 1001: [BeiJing2006]狼抓兔子

    1001: [BeiJing2006]狼抓兔子 Time Limit: 15 Sec  Memory Limit: 162 MBSubmit: 20029  Solved: 4957[Submit][ ...

  5. git 修改最后一次提交的用户名 或者 commit的内容

    修改git最后一次提交的命令 $ git commit --amend 修改git最后一次提交用户名的相关命令 git config user.name 'wangz' git config user ...

  6. Openjudge 1.13-23:区间内的真素数(每日一水)

    总时间限制:  1000ms 内存限制:  65536kB 描述 找出正整数 M 和 N 之间(N 不小于 M)的所有真素数.真素数的定义:如果一个正整数 P 为素数,且其反序也为素数,那么 P 就为 ...

  7. [LeetCode] Peeking Iterator 顶端迭代器

    Given an Iterator class interface with methods: next() and hasNext(), design and implement a Peeking ...

  8. [LeetCode] Next Permutation 下一个排列

    Implement next permutation, which rearranges numbers into the lexicographically next greater permuta ...

  9. 【前端积累】SEO 学习

    白帽SEO:网站标题  关键字  描述   网站内容优化   Robot.txt文件   网站地图   增加外链引用 网站结构布局优化:扁平化结构 控制首页链接数量:中小网站100以内,页面导航.底部 ...

  10. jQuery 自定义插件 (分页控件)

    1.引入jqpage.js 2.html代码 <div id="page"> </div> 3.js 调用 $(function () { $.fn.jqp ...