最近开始在整理ES6/ES7/ES8/ES9的知识点(已经上传到 我的博客 上),碰到一些知识点是自己已经忘记(用得少的知识点),于是也重新复习了一遍。

这篇文章要复习的 instanceof 是我在整理过程中遇到的,那就整理下来吧,不然容易忘记。

要是哪里写得不妥,欢迎各位大佬指点。

1.定义

instanceof运算符用于测试构造函数的prototype属性是否出现在对象的原型链中的任何位置。 —— MDN

简单理解为:instanceof可以检测一个实例是否属于某种类型。

比如:

function F (){
// ...
}
let a = new F (); a instanceof F; // true
a instanceof Object; // true 后面介绍原因

还可以在继承关系中用来判断一个实例是否属于它的父类型。

比如:

function F (){};
function G (){};
function Q (){};
G.prototype = new F(); // 继承 let a = new G();
a instanceof F; // true
a instanceof G; // true
a instanceof Q; // false

2.使用方法

语法为: object instanceof constructor

  • object : 需要测试的函数
  • constructor : 构造函数

即:用instanceof运算符来检测constructor.prototype 是否存在参数object的原型链。

function F (){};
function G (){};
let a = new F (); a instanceof F; // true 因为:Object.getPrototypeOf(a) === F.prototype
a instanceof Q; // false 因为:F.prototype不在a的原型链上
a instanceof Object; // true 因为:Object.prototype.isPrototypeOf(a)返回true
F.prototype instanceof Object; // true,同上

注意

  1. a instanceof F 返回 true 以后,不一定永远都都返回为trueF.prototype属性的值有可能会改变。
  2. 原表达式a的值也会改变,比如 a.__proto__ = {}之后,a instanceof F就会返回false了。

检测对象是不是特定构造函数的实例:

// 正确
if (!(obj instanceof F)) {
// ...
} // 错误 因为
if (!obj instanceof F); // 永远返回false
// 因为 !obj 在instanceof之前被处理 , 即一直使用一个布尔值检测是否是F的实例

3.实现instanceof

/**
* 实现instanceof
* @param obj{Object} 需要测试的对象
* @param fun{Function} 构造函数
*/
function _instanceof(obj, fun) {
let f = fun.prototype; // 取B的显示原型
obj = obj.__proto__; // 取A的隐式原型
while (true) {
//Object.prototype.__proto__ === null
if (obj === null)
return false;
if (f === obj) // 这里重点:当 f 严格等于 obj 时,返回 true
return true;
obj = obj.__proto__;
}
}

4.instanceof 与 typeof 对比

相同

instanceoftypeof都能用来判断一个变量的类型。

区别

instanceof 只能用来判断对象、函数和数组,不能用来判断字符串和数字等:

let a = {};
let b = function () {};
let c = [];
let d = 'hi';
let e = 123; a instanceof Object; // true
b instanceof Object; // true
c instanceof Array; // true
d instanceof String; // false
e instanceof Number; // false

typeof :用于判断一个表达式的原始值,返回一个字符串。

typeof 42;         // "number"
typeof 'blubber'; // "string"
typeof true; // "boolean"
typeof aa; // "undefined"

一般返回结果有:

  • number
  • boolean
  • string
  • function(函数)
  • object(NULL,数组,对象)
  • undefined。

判断变量是否存在

不能使用:

if(a){
//变量存在
}
// Uncaught ReferenceError: a is not defined

原因是如果变量未定义,就会报未定义的错,而应该使用:

if(typeof a != 'undefined'){
//变量存在
}

5.参考资料

  1. MDN instanceof

  2. IBM instanceof

  3. js中typeof和instanceof用法区别

【重温基础】instanceof运算符的更多相关文章

  1. Java基础——Instanceof 运算符

    Instanceof 运算符 java 中的instanceof 运算符是用来在运行时指出对象是否为特定类的一个实例 instanceof运算返回值:boolean类型 用法 boolean resu ...

  2. 《Java基础知识》Java instanceof 运算符

    java多态性带来一个问题,就是如何判断一个变量所实际引用对象的类型.这里java帮我们引入了 instanceof 运算符. instanceof运算符用来判断一个变量的所引用对象的实际类型,注意是 ...

  3. JavaScript instanceof 运算符深入剖析

    简介: 随着 web 的发展,越来越多的产品功能都放在前端进行实现,增强用户体验.而前端开发的主要语言则是 JavaScript.学好 JavaScript 对开发前端应用已经越来越重要.在开发复杂产 ...

  4. JavaScript instanceof 运算符深入剖析【转载】

    http://www.ibm.com/developerworks/cn/web/1306_jiangjj_jsinstanceof/   instanceof 运算符简介 在 JavaScript ...

  5. instanceof 运算符简介

    文章摘自: http://www.ibm.com/developerworks/cn/web/1306_jiangjj_jsinstanceof/ https://developer.mozilla. ...

  6. 【重温基础】15.JS对象介绍

    从这篇文章开始,复习 MDN 中级教程 的内容了,在初级教程中,我和大家分享了一些比较简单基础的知识点,并放在我的 [Cute-JavaScript]系列文章中. 关于[Cute-JavaScript ...

  7. instanceof 运算符

    java中的instanceof=======>二元运算符 用法: result = object instanceof class 参数: result 是boolean类型 object 是 ...

  8. instanceof运算符

    instanceof运算符:判断该对象是否是某一个类的实例. 语法格式:boolean b = 对象A instanceof 类B://判断A对象是否是B类的实例,如果是返回true. 若对象是类的实 ...

  9. Object.prototype 与 Function.prototype 与 instanceof 运算符

    方法: hasOwnProperty isPrototypeOf propertyIsEnumerable hasOwnProperty 该方法用来判断一个对象中的某一个属性是否是自己提供的( 住要用 ...

随机推荐

  1. JDBC事务的简单使用

    在实际功能当中,经常会碰到同时对一组数据进行增加和减少,最常见的就是交易功能. 事务内执行的语句,要么都成功,要么都失败,如果有一句没执行成功,整个事务都不会提交的. import java.sql. ...

  2. 百度全景地图使用时提示flash版本过低 如何处理?

    从Chrome 69.0 版本起,Flash权限受到进一步限制,默认仅在当前浏览器会话有效.关闭Enable Ephemeral Flash Permissions ,才能看到 “Add”按钮.解决方 ...

  3. 领扣(LeetCode)最长和谐子序列 个人题解

    和谐数组是指一个数组里元素的最大值和最小值之间的差别正好是1. 现在,给定一个整数数组,你需要在所有可能的子序列中找到最长的和谐子序列的长度. 示例 1: 输入: [1,3,2,2,5,2,3,7] ...

  4. linux启动与登录

    1.............rescue..............进入维护模式 (grub选项吧这是) 2.linux启动的幕后过程: 1 加电 (再一次联想服务器升级内存时,加电后有个黄色报警,过 ...

  5. IPv6,无需操作就可升级?

    最近这段时间,5G 出现在你能看到的各种信息里,铺天盖地的宣传提醒着大家新一代互联网的到来.其实早在几年前 5G 就有所提及,可是为什么到现在才开始窜上热门呢?这就涉及到了 IPv6. 或许有不少朋友 ...

  6. Redis集群同步问题

    之前被面试官问到:Redis集群中主从数据同步是从库异步读取主库,那么Redis集群其他主与主之间的数据是怎么共享的呢?或者说是怎么同步的? emmmm……当时我就懵逼了,这不是考试范围啊卧槽~只能老 ...

  7. 【论文阅读】Between-class Learning for Image Classification

    文章:Between-class Learning for Image Classification 链接:https://arxiv.org/pdf/1711.10284.pdf CVPR2018 ...

  8. ubuntu windows mutual remote control

    Win10 remote control Ubuntu18 Part1.ubuntu settings 1.安装所需组件 sudo apt-get update //若没有desktop sharin ...

  9. 如何理解Nginx, WSGI, Flask(Django)之间的关系

    如何理解Nginx, WSGI, Flask(Django)之间的关系 值得指出的是,WSGI 是一种协议,需要区分几个相近的名词: uwsgi 同 wsgi 一样也是一种协议,uWSGI服务器正是使 ...

  10. EntityFramework Core 3多次Include导致查询性能低之解决方案

    前言 上述我们简单讲解了几个小问题,这节我们再来看看如标题EF Core中多次Include导致出现性能的问题,废话少说,直接开门见山. EntityFramework Core 3多次Include ...