前面详细的解释了new的几个步骤,其中随意带过了一下原型链的概念,如果细读那篇文章,基本对原型也能有所理解。

原型有两个关键属性,一个是 __proto__ 一个是 prototype ,了解了这两个对象基本就能了解整个原型链的关系。

本篇主要探讨一下 __proto__ 这个属性。

javascript中几乎所有类型都拥有 __proto__ 这个属性,可以打印下面的 __proto__ 的值看看都是什么结果。

"字符串".__proto__
(123456).__proto__
(true).__proto__
(function(){}).__proto__
([]).__proto__
({}).__proto__

它们都有值,并且它们的值似乎告诉它们是什么,例如前面都有类型如 String 或 Boolean 或在直接放回该类型的字面量写法 function(){}; []; {}; ,那现在就假设 __proto__ 的用处就是说出它们是谁.。

再关注一点细节,这三个基本类型的 __proto__ 有一些相似,大概是这样的。

String {length: 0, [[PrimitiveValue]]: ""}
Number {[[PrimitiveValue]]: 0}
Boolean {[[PrimitiveValue]]: false} //以上出自chrome控制台

这三个值都是对象,展开它们会发现一些这种类型常用的属性,例如

length
match
toFixed
toString

它们都是什么鬼,难道在使用这些属性或方法的时候都是通过__proto__上找的,我只好假定 __proto__ 的作用是提供一些js原生的属性和方法,那么刚好就得出一个结论这些值原生的属性和方法都是从 __proto__ 来的。

接着往下走吧,还是不能理解 __proto__ ,但是大概了解了它的一些信息。

还发现一个规律, __proto__ 里面还有一个 __proto__ ,并且它们的值都是一样的并且是一个Object对象,这里又可以得出一个结论,这些数据类型通过 __proto__ 都会找到同一个Object对象。


再接下来插播一下null和undefined

为什么整篇都不见 undefined 和 null 这两个基友,而且当使用 undefined.__proto__ 和 null.__proto.__ 的时候会报错,说明这两个并没有这两个属性,但是在js中没有这个属性会返回 undefined ,那只能根据错误提示来参考,

Uncaught TypeError: Cannot read property '__proto__' of undefined
未知的类型错误,无法读取undefined的__proto__属性
也就是说这两个值不存在属性或方法的概念,它们本身就代表着无。

那么现在基本可以知道,在js中,只有两种类型,一种是有值类一种是无值类,有值类都可以通过 __proto__ 最终指向 Object 对象,而无值类就是 null 和 undefined 两种,一种代表空,一种代表未定义。


到了这里,大概明白了 __proto__ 是干什么的了,我并没有给它一个明确的定义,但是我可以简单的说一下它的功能:

  1. 除了 undefined 和 null 之外的所有值都有 __proto__ 这个值
  2. 这个 __proto__ 的值最终会指向同一个 Object 对象,例如 : 类似与这样查找最终会中找到 Object 对象: *.__proto.__.__proto.__.***__proto.__
  3. 某一个值的每一层的 __proto__ 中的方法都可以直接使用,例如: true.__proto__ 中有 toString 方法,那么就可以直接使用这个 true.toString() 方法,再例如 true.__proto.__.__proto.__ 中拥有 hasOwnProperty 这个方法,那么就直接可以使用 true.hasOwnProperty()

原型链(__proto__)的更多相关文章

  1. 原型prototype、原型链__proto__、构造器constructor

    创建函数时,会有原型prototype,有原型链__proto__,有constructor.(构造函数除外,没有原型) . prototype原型:是对象的一个属性(也是对象),使你有能力向对象添加 ...

  2. javascript原型链__proto__属性的理解

    在javascript中,按照惯例,构造函数始终都应该以一个大写字母开头,而非构造函数则应该以一个小写字母开头.一个方法使用new操作符创建,例如下面代码块中的Person1(可以吧Person1看做 ...

  3. 原型prototype与原型链__proto__

    在 javascript 中我们会约定俗成,如果一个方法是被 new 出来使用的,那么该方法名首字母通常会大写,例如下面代码块中的 Person. var Person = function(name ...

  4. Javascript中的原型链,__proto__和prototype等问题总结

    1.js中除了原始数据类型 都是对象. 包括函数也是对象,可能类似于C++函数对象把 应该是通过解释器 进行()操作符重载或其他操作, 用的时候把它当函数用就行 但是实际上本质是一个对象 原型也是一个 ...

  5. javascript 原型及原型链的初步理解

    最近折腾了好久,终于是把js里面的原型和原型链做了个初步的理解: 在这里,我打个比喻: 我(child),我妈constructor(构造函数)生了我:别人问我老妈跟谁生的我,于是此时我妈会指向我爸爸 ...

  6. 用hasOwnProperty获取对象自身的属性排除原型链

    今天遇到一个多层级的object. 需要判定每一层级的data下是否有title属性.在下图中展开的data自身其实是没有title的,但由于受到原型链__proto__的影响,在获取parent.d ...

  7. JS面向对象组件(二)--Javascript原型链

    原型链 : 实例对象与原型之间的连接,叫做原型链 –__proto__( 隐式连接 ),这就是原型链,平时我们是看不到的. 原型链的最外层 : Object.prototype function Aa ...

  8. [转] Javascript 原型链

    1. 类 在C或者Java里,int a;定义了一个int类型的变量a.其中int是类型的名字,a是具体的变量. Javascript 模仿自 Java, 有一部分面向对象编程的部分.在面向对象的编程 ...

  9. _proto_ && prototype (原型 && 原型链)

    原型一直都是JavaScript基础里面的痛点,因为在JavaScript里面没有类的概念,都是通过原型对象来实现继承,下面的这个图很好的说明几者之间的关系! a.__proto__ = A.prot ...

  10. 小谈js原型链和继承

    原型(prototype)在js中可是担当着举足轻重的作用,原型的实现则是在原型链的基础上,理解原型链的原理后,对原型的使用会更加自如,也能体会到js语言的魅力. 本文章会涉及的内容 原型及原型对象 ...

随机推荐

  1. Qt序列化格式分析(qint,QString)(非常简单好用)

    最近项目需要进行QT开发环境下对传输对象进行序列化与反序列化处理,对基本类型的处理在使用QT默认的序列化方式还是完全手工序列化这两种方式之间有些犹疑不定,边想了解下QT默认序列化基本类型的格式,项目中 ...

  2. the Meta-Object Compiler (moc)

    the Meta-Object Compiler (moc) 元对象编译器是处理Qt的C++扩展的程序. moc工具读取C++头文件,如果它找到一个或者多个类声明包含Q_OBJECT宏.它生为那些类成 ...

  3. ThreadLocal用法和实现原理(转)

    如果你定义了一个单实例的java bean,它有若干属性,但是有一个属性不是线程安全的,比如说HashMap.并且碰巧你并不需要在不同的线程中共享这个属性,也就是说这个属性不存在跨线程的意义.那么你不 ...

  4. Agg vs. Cairo 二维绘图引擎之比较和选择 .

    Agg vs. Cairo 二维绘图引擎之比较和选择 cheungmine 当今时代对于作为二维图形软件开发者, 是幸运的.因为除了Windows GDI/GDI+之外,我们还有很多其他的选择.而且这 ...

  5. Java Socket实现HTTP客户端来理解Session和Cookie的区别和联系

    HTTP协议本身是无状态的,即使是同一台电脑同一个浏览器打开同一个页面两次,服务器不知道这两次请求是同一个客户端发送过来的,两次请求是完全独立的.例如,第一次请求时已经登录了,第二次再请求服务器会“忘 ...

  6. windows下安装mysql5.6.13的主从复制

    如下操作均在vmware 虚拟机中winows xp 测试成功 中间走了很多弯路,网上的很多资料都是针对5.1以前的版本,在新版中根本无法使用,所以根据自己的实践整理了这篇文章 主服务:192.168 ...

  7. java layout 表格项增加、删除、修改

    实现的内容为:点击表格某项,再点击删除钮,可实现删除点击表格某项,再点击编辑按钮,可实现内容改变点击添加按钮,可实现向表格中添加内容 总结:总的来说中间遇到了很多困难,但是都一步步的解决了. pack ...

  8. 华为手机logcat不出日志解决方案

    解决方法:在拨打电话界面,录入*#*#2846579#*#* 自动进入开发界面菜单,进入第一个,选择开启logcat.

  9. var, object, dynamic的区别以及使用(转载)

    var, object, dynamic的区别以及使用 阅读目录: 一. 为什么是它们三个 二. 能够任意赋值的原因 三. dynamic的用法 四. 使用dynamic的注意事项 拿这三者比较的原因 ...

  10. EasyUI - According 分类列表

    效果: html代码: <div id="aa" class="easyui-accordion" style="width: 300px; h ...