读jquery源码的时候,发现作者为了让创建jquery对象更容易使用了用函数返回对象的方法

jQuery = function( selector, context ) {
return new jQuery.fn.init( selector, context, rootjQuery );
}

jQuery 对象的方法都定义在jQuery.prototype 上,然后init也是原型上的一个方法,为了让jQuery.fn.init构造函数能够继承jQuery.prototype上的方法把jQuery.fn.init.prototype指向了jQuery.prototype

jQuery.fn = jQuery.prototype = {
constructor: jQuery,
...,
init: function( selector, context, rootjQuery ) {},
...,
}
jQuery.fn.init.prototype = jQuery.fn;

这样是妥善解决了方法继承问题,但是有个疑问:构造函数jQuery.fn.init创建的实例的对象类型是jQuery对象吗?

var obj = jQuery();
obj instanceof jQuery.fn.init //true
obj instanceof jQuery //这里obj好像跟jQuery 毫无关系

但是试了一下jQuery 方法创建的对象确实是jQuery的实例也就是说obj instanceof jQuery 为true;
于是就引出了JavaScript中instanceof的判断依据是什么的困惑,百思不得其解,网上查了一下原来是根据实例的__proto__ 属性。
instanceof的判断依据:
在实现js的继承的时候,每一个用new 构造出来的对象都会有一个私有的属性,在firefox和chrome中这个私有的属性叫做 __proto__,在 IE中也有一个这样类的的私有属性,只不过没有暴露给用户。
这个属性指向其构造函数的 prototype ,在执行 o2 = new O2() 的时候会有类似这样的赋值o2.__proto__ = O2.prototype所以在chrome 和 firefox中:
o2 instaneof O2 其实相当于 o2.__proto__ === O2.prototype || o2.__proto__.__proto__ === O2.prototype || ...
IE中也是类似,只不过这个属性不叫 __proto__
P.S 继承的实现:
当你读取 o2.pro 的时候,会现在o2中寻找有没有一个叫 pro 的属性,没有的话就去o2.__proto__中找有没有,还没有的话,就去o2.__proto__.__proto__中去找(记住一个对象的__proto__就是其构造函数的prototype)。。。这样一直下去其实最终会找到 Object.prototype,这样就实现了所有的对象都继承了Object。
当你写入 o2.pro 的时候就只会在o2中查找,不会递归的查找o2.__proto__,这样就会得到一个新的(如果没有的话)pro属性,然后当你再次访问 o2.pro 的时候,就是访问的这个新的属性,即使o2.__proto__中有这个属性,这就完成了属性/函数的重载

JavaScript中instanceof的判断依据的更多相关文章

  1. 深入剖析JavaScript中的数据类型判断(typeof instanceof prototype.constructor)

    关于JavaScript中的类型判断,我想大部分JavaScripter 都很清楚 typeof 和  instanceof,却很少有人知道 constructor,以及constructor与前面二 ...

  2. JavaScript中instanceof与typeof运算符的用法及区别详细解析

    JavaScript中的instanceof和typeof常被用来判断一个变量是什么类型的(实例),但它们的使用还是有区别的: typeof 运算符 返回一个用来表示表达式的数据类型的字符串. typ ...

  3. 在JavaScript中,如何判断数组是数组?

    如果你没有注意过这个问题,那么这个标题应该会让你感到困惑,判断数据类型这么基础的问题能有什么坑呢? 少年,你不能太天真了,我们朝夕面对的这门语言,可是JavaScript呀,任何你觉得已经习以为常的东 ...

  4. Javascript中类型的判断

    数据类型的判断有这么几种方式 1.一元运算符 typeOf 2.关系运算符 instanceof 3.constructor 属性 4.prototype属性 一.typeof typeof的返回值有 ...

  5. JavaScript中准确的判断数据类型

    在 ECMAScript 规范中,共定义了 7 种数据类型,分为基本类型和引用类型两大类. 其中: 基本类型:String.Number.Boolean.Symbol.Undefined.Null  ...

  6. Javascript中数组的判断方法

    摘要: 1.数组检测的方法: 1) typeof . 2) instanceof . 3) constructor . 4) Object.prototype.toString. 5) Array.i ...

  7. JavaScript中instanceof运算符的用法以及和typeof的区别

    instanceof : 判断一个对象是否为某一数据类型,或一个变量是否为一个对象的实例:返回boolean类型栗子①: var aColors = ["red", "g ...

  8. javascript中的分支判断与循环

    分支判断与循环 分支结构 单一选择结构(if) 二路选择结构(if/else) 内联三元运算符 ?: 多路选择结构(switch) var condition = true; if (conditio ...

  9. JavaScript 中 if 条件判断

    在JS中,If 除了能够判断bool的真假外,还能够判断一个变量是否有值. 下面的例子说明了JS中If的判断逻辑: 变量值 true '1' 1 '0' 'null' 2 '2'  false 0 n ...

随机推荐

  1. C/C++中变量的作用域和存储类型简介

    写在开头 对于很多C/C++的初学者来说,很容易理不清变量的作用域和存储类型这一块的一些概念,也容易将其中的一些概念搞混淆.作为一个C/C++的初学者,笔者希望在这里能够尝试着去理一理这些较为繁杂的概 ...

  2. .net core 3.0 Signalr - 03 使用MessagePack压缩传输内容

    ## MessagePack基础介绍 Signalr默认使用的是json形式传递数据,但是signalr提供了灵活的扩展,支持MessagePack形式序列化数据,以增加性能降低网络传输的效果,极大的 ...

  3. selenium实现百度图片爬取

    因为是百度图片是瀑布流ajax异步上传的数据,所以这里用到抓包工具来抓取链接(fiddler) 好了直接上代码, from selenium import webdriver from seleniu ...

  4. 【JavaScript】使用纯JS实现多张图片的懒加载(附源码)

    一.效果图如下 上面的效果图,效果需求如下 1.还没加载图片的时候,默认显示加载图片背景图 2.刚开始进入页面,自动加载第一屏幕的图片 3.下拉界面,当一张图片容器完全显露出屏幕,即刻加载图片,替换背 ...

  5. 死磕 java线程系列之线程池深入解析——体系结构

    (手机横屏看源码更方便) 注:java源码分析部分如无特殊说明均基于 java8 版本. 简介 Java的线程池是块硬骨头,对线程池的源码做深入研究不仅能提高对Java整个并发编程的理解,也能提高自己 ...

  6. docker在Mac上的下载安装

    在Mac上下载安装docker,下载链接:Stable 安装成功后启动终端,检查安装后的docker版本: yanguobindeMacBook-Pro:~ yanguobin$ docker --v ...

  7. MongoDB系列(一):初步理解

    一.简介 MongoDB是一款强大.灵活.且易于扩展的通用型数据库 1.易用性 1)MongoDB是一款面向文档的数据库,而不是关系型数据库,因此而有着更好的扩展性. 2)通过在文档中嵌入文档和数组, ...

  8. 计算几何基础算法几何C++实现

    This file is implementation of Common Common Computational Geometry Algorithms.Please please pay att ...

  9. NAT模式实现虚拟机共享主机网络

    上一节我们在虚拟机上搭建了linux系统,并利用桥接模式访问互联网,这一节,我们来配置一下通过NAT模式访问互联网.说到这里有些小伙伴可能要问了,NAT模式和桥接模式有什么区别呢? 桥接模式: 虚拟机 ...

  10. 主动降噪(Active Noise Control)

    智能耳机 人机交互 智能声学终端 智能耳机 智能音箱 智能听力器 喇叭单体 动圈喇叭 新材料 DLC 石墨烯 陶瓷单位 吸音材料 智能芯片 阵列式麦克风 声纹传感器 演算法 降噪算法 智能听力保护 A ...