javascript中instanceof运算符的用法详解

 更新时间:2022年06月21日 10:08:44   作者:小旭2021  
本文详细讲解了javascript中instanceof运算符的用法,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

概述

instanceof运算符用来判断一个构造函数的prototype属性所指向的对象是否存在另外一个要检测对象的原型链上

语法

obj instanceof Object;//true 实例obj在不在Object构造函数中

描述

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

实例

1.instanceof的普通的用法,obj instanceof Object 检测Object.prototype是否存在于参数obj的原型链上。

Person的原型在p的原型链中

function Person(){};
var p =new Person();
console.log(p instanceof Person);//true

2.继承中判断实例是否属于它的父类

Student和Person都在s的原型链中

function Person(){};
function Student(){};
var p =new Person();
Student.prototype=p;//继承原型
var s=new Student();
console.log(s instanceof Student);//true
console.log(s instanceof Person);//true

3.复杂用法

这里的案例要有熟练的原型链的认识才能理解

function Person() {}
console.log(Object instanceof Object);     //true
//第一个Object的原型链:Object=>
//Object.__proto__ => Function.prototype=>Function.prototype.__proto__=>Object.prototype
//第二个Object的原型:Object=> Object.prototype

console.log(Function instanceof Function); //true
//第一个Function的原型链:Function=>Function.__proto__ => Function.prototype
//第二个Function的原型:Function=>Function.prototype

console.log(Function instanceof Object);   //true
//Function=>
//Function.__proto__=>Function.prototype=>Function.prototype.__proto__=>Object.prototype
//Object => Object.prototype

console.log(Person instanceof Function);      //true
//Person=>Person.__proto__=>Function.prototype
//Function=>Function.prototype

console.log(String instanceof String);   //false
//第一个String的原型链:String=>
//String.__proto__=>Function.prototype=>Function.prototype.__proto__=>Object.prototype
//第二个String的原型链:String=>String.prototype

console.log(Boolean instanceof Boolean); //false
//第一个Boolean的原型链:Boolean=>
//Boolean.__proto__=>Function.prototype=>Function.prototype.__proto__=>Object.prototype
//第二个Boolean的原型链:Boolean=>Boolean.prototype

console.log(Person instanceof Person); //false
//第一个Person的原型链:Person=>
//Person.__proto__=>Function.prototype=>Function.prototype.__proto__=>Object.prototype
//第二个Person的原型链:Person=>Person.prototype

总结

对应上述规范做个函数模拟A instanceof B:

function _instanceof(A, B) {
    var O = B.prototype;// 取B的显示原型
    A = A.__proto__;// 取A的隐式原型
    while (true) {
        //Object.prototype.__proto__ === null
        if (A === null)
            return false;
        if (O === A)// 这里重点:当 O 严格等于 A 时,返回 true
            return true;
        A = A.__proto__;
    }
}

到此这篇关于javascript中instanceof运算符的文章就介绍到这了。希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • 常用一些Javascript判断函数

    常用一些Javascript判断函数

    常用一些Javascript判断函数,都是一些js基础知识,学习js的朋友可以看下
    2012-08-08
  • JavaScript DOM元素尺寸和位置

    JavaScript DOM元素尺寸和位置

    这篇文章主要介绍了JavaScript DOM元素尺寸和位置,需要的朋友可以参考下
    2015-04-04
  • JavaScript高级程序设计(第3版)学习笔记9 js函数(下)

    JavaScript高级程序设计(第3版)学习笔记9 js函数(下)

    函数是一种对象,拥有一般对象具有的所有特征,除了函数可以有自己的属性和方法外,还可以做为一个引用类型的值去使用,实际上我们前面的例子中已经有过将函数作为一个对象属性的值,又比如函数也可以作为另一个函数的参数或者返回值,异步处理中的回调函数就是一个典型的用法
    2012-10-10
  • JavaScript数据类型详解

    JavaScript数据类型详解

    这篇文章主要介绍了JavaScript数据类型详解,本文详细讲解了JavaScript中有5种基本数据类型:Undefined、Null、Boolean、Number和String,需要的朋友可以参考下
    2015-04-04
  • Javascript String.replace的妙用

    Javascript String.replace的妙用

    字符替换是一个非常重要的功能,javascript 中有一个 String.replace( ),但是此方法有很多不为新手所知的妙用,如果用的好了,可以为您节省很多宝贵时间,还等什么?马上进来看看吧!
    2009-09-09
  • 实现高性能JavaScript之执行与加载

    实现高性能JavaScript之执行与加载

    avaScript在浏览器中的性能,此问题因JavaScript的阻塞特征而复杂,也就是说JavaScript运行时其他的事情不能被浏览器处理,事实上,大多数浏览器使用单进程处理JavaScript运行等多个任务,而同一时间只能有一个任务被执行。
    2016-01-01
  • 举例讲解JavaScript中将数组元素转换为字符串的方法

    举例讲解JavaScript中将数组元素转换为字符串的方法

    这篇文章主要介绍了JavaScript中将数组元素转换为字符串的方法,是JS入门学习中的基础知识,需要的朋友可以参考下
    2015-10-10
  • js创建jsonArray传输至后台及后台全面解析

    js创建jsonArray传输至后台及后台全面解析

    下面小编就为大家带来一篇js创建jsonArray传输至后台及后台全面解析。小编觉得挺不错的,现在分享给大家,也给大家做个参考。
    2016-04-04
  • JavaScript 学习笔记之操作符

    JavaScript 学习笔记之操作符

    本文着重给大家介绍了javascript的操作符,包含一元操作符、位操作符、布尔操作符这3种类型,讲解的十分全面,小伙伴们参考下
    2015-01-01
  • Javascript学习笔记之 对象篇(一) : 对象的使用和属性

    Javascript学习笔记之 对象篇(一) : 对象的使用和属性

    Javascript 中的一切都可以视为对象,除了两个特例:null 和 undefined。
    2014-06-06

最新评论