运行流程

function instance_of(L, R) {                               //L 表示左表达式,R 表示右表达式
  var O = R.prototype;                                    // 取 R 的显式原型(后面的对象只取显式原型prototype)
  L = L.__proto__;                                       // 取 L 的隐式原型(判断的对象取__proto__,而且会一直向上判断)
  while (true) { 
    if (L === null) 
      return false; 
    if (O === L)                                          // 这里重点:当 O 严格等于 L 时,返回 true 
      return true; 
    L = L.__proto__; 
  } 
 }
 
在 JavaScript 原型继承结构里面,规范中用 [[Prototype]] 表示对象隐式的原型,在 JavaScript 中用 __proto__ 表示,并且在 Firefox 和 Chrome 浏览器中是可以访问得到这个属性的,但是 IE11 以下不行。所有 JavaScript 对象都有 __proto__ 属性,但只有 Object.prototype.__proto__ 为 null,前提是没有在 Firefox 或者 Chrome 下修改过这个属性。这个属性指向它的原型对象。 至于显式的原型,在 JavaScript 里用 prototype 属性表示
 
 
 
判断举例
Object instanceof Object
// 为了方便表述,首先区分左侧表达式和右侧表达式
 ObjectL = Object, ObjectR = Object; 
 // 下面根据规范逐步推演
 O = ObjectR.prototype = Object.prototype 
 L = ObjectL.__proto__ = Function.prototype 
 // 第一次判断
 O != L 
 // 循环查找 L 是否还有 __proto__ 
 L = Function.prototype.__proto__ = Object.prototype 
 // 第二次判断
 O == L 
 // 返回 true
 
 
Function instanceof Function
// 为了方便表述,首先区分左侧表达式和右侧表达式
 FunctionL = Function, FunctionR = Function; 
 // 下面根据规范逐步推演
 O = FunctionR.prototype = Function.prototype 
 L = FunctionL.__proto__ = Function.prototype 
 // 第一次判断
 O == L 
 // 返回 true
 
 
Foo instanceof Foo
// 为了方便表述,首先区分左侧表达式和右侧表达式
 FooL = Foo, FooR = Foo; 
 // 下面根据规范逐步推演
 O = FooR.prototype = Foo.prototype 
 L = FooL.__proto__ = Function.prototype 
 // 第一次判断
 O != L 
 // 循环再次查找 L 是否还有 __proto__ 
 L = Function.prototype.__proto__ = Object.prototype 
 // 第二次判断
 O != L 
 // 再次循环查找 L 是否还有 __proto__ 
 L = Object.prototype.__proto__ = null 
 // 第三次判断
 L == null 
 // 返回 false
 

instanceof 原理的更多相关文章

  1. 夯实基础之--new关键字、instanceOf原理

    1.instanceOf原理  检测右边构造函数的prototype是否在左边对象的原型链上,在返回true,不在返回false 例:function  Persion(name,age){ this ...

  2. javascript中原型链与instanceof 原理

    instanceof:用来判断实例是否是属于某个对象,这个判断依据是什么呢? 首先,了解一下javascript中的原型继承的基础知识: javascript中的对象都有一个__proto__属性,这 ...

  3. 详解 JS 中 new 调用函数原理

    JavaScript 中经常使用构造函数创建对象(通过 new 操作符调用一个函数),那在使用 new 调用一个函数的时候到底发生了什么?先看几个例子,再解释背后发生了什么. 1)看三个例子 1.1 ...

  4. JavaScript 数据类型

    JavaScript 数据类型 字符串.数字.布尔.数组.对象.Null.Undefined JavaScript 拥有动态类型.这意味着相同的变量可用作不同的类型: 一,JavaScript 字符串 ...

  5. JavaScript高级内容:原型链、继承、执行上下文、作用域链、闭包

    了解这些问题,我先一步步来看,先从基础说起,然后引出这些概念. 本文只用实例验证结果,并做简要说明,给大家增加些印象,因为单独一项拿出来都需要大篇幅讲解. 1.值类型 & 引用类型 funct ...

  6. 详谈JavaScript原型链

    目录 创建对象有几种方法 原型.构造函数.实例.原型链 instanceof的原理 new运算符 创建对象的方法 在了解原型链之前,首先先了解一下创建对象的几种方式,介绍以下三种. 代码: <s ...

  7. javascript深入浅出——学习笔记(包装对象和类型检测)

    3包装对象:https://www.imooc.com/video/5676 当我们尝试把基本类型已对象的方式访问时,javascript会把该基本类型转换为对应的包装类型对象(临时对象),相当于ne ...

  8. JS学习笔记Day17

    一. 创建对象的方法 (一)在了解原型链之前,首先先了解一下创建对象的几种方式,介绍以下三种. 代码: <script type="text/javascript"> ...

  9. 前端JS基础知识

    1. 原型 / 构造函数 / 实例 原型(prototype): 一个简单的对象,用于实现对象的 属性继承.可以简单的理解成对象的爹.在 Firefox 和 Chrome 中,每个JavaScript ...

随机推荐

  1. http_load压力测试windows版使用方法及结果分析

    工具下载: https://pan.baidu.com/s/1gftN13H 配置说明:解压后将cygwin1.dll 放置到 C:\Windows\system目录下,将http_load.exe ...

  2. WPF控件自适应屏幕

    如果说界面设计,那么自适应问题一定无法避免,今天就来分享一下,wpf如何实现自适应,先看一下效果:(文末添加源代码下载)     基本思路就是用 Grid 的网格,进行宽度的自动填充适应,  不过对于 ...

  3. Python迭代器,生成器--精华中的精华

    1. 迭代器 迭代器是访问集合元素的一种方式.迭代器对象从集合的第一个元素开始访问,直到所有的元素被访问完结束.迭代器只能往前不会后退,不过这也没什么,因为人们很少在迭代途中往后退.另外,迭代器的一大 ...

  4. 进入css3动画世界(二)

    进入css3动画世界(二) 今天主要来讲transition和transform入门,以后会用这两种属性配合做一些动效. 注:本文面向前端css3动画入门人员,我对这个也了解不深,如本文写的有纰漏请指 ...

  5. Mybatis #{ } 和 ${ } 区别

    动态 SQL 是 Mybatis 的强大特性之一,也是它优于其他 ORM 框架的一个重要原因.Mybatis 在对 sql 语句进行预编译之前,会对 sql 进行动态解析,解析为一个 BoundSql ...

  6. 51 nod 1624 取余最长路 思路:前缀和 + STL(set)二分查找

    题目: 写这题花了我一上午时间. 下面是本人(zhangjiuding)的思考过程: 首先想到的是三行,每一行一定要走到. 大概是这样一张图 每一行长度最少为1.即第一行(i -1) >= 1, ...

  7. web版的tty

      1.wetty Wetty是使用Node.js和websockets开发的一个开源`Web-based SSH` 2.环境配置 2.1.配置epel源 [epel] name=epel baseu ...

  8. Digital Square 搜索

    Digital Square Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u Subm ...

  9. PE文件格式详解,第二讲,NT头文件格式,以及文件头格式

    PE文件格式详解,第二讲,NT头文件格式,以及文件头格式 作者:IBinary出处:http://www.cnblogs.com/iBinary/版权所有,欢迎保留原文链接进行转载:) PS:本篇博客 ...

  10. mybatis 和hibernate的区别

    mybaits 是不完全的orm(对象关系映射(Object Relational Mapping)框架,需要自己书写sql语句 mybatis学习难度必hibernate低适合关系型模型要求不高的软 ...