【JavaScript】【表达式和运算符】instanceof
前言
在JavaScript中,判断变量的类型,常常使用的是typeof
运算符
typeof
的痛点:
- 所有的引用类型结果都是
Object
; - 空值
null
的结果也是Object
;
为此,引入 instanceof
一、instanceof
1.1 作用
- 用于判断某个实例是否属于某构造函数
- 在继承关系中,用来判断一个实例是否属于它的父类型或祖先类型的实例
1.2 使用
语法:
object instanceof constructor
参数:
object
:某个实例对象constructor
:某个构造函数
示例:
// 类
class Maomi {} // 定义类
let fuLai = new Maomi() // fuLai是Maomi类的实例对象
fuLai instanceof Maomi // true
// 时间
new Date() instanceof Date // true
// 构造函数
function SetMaomi() {}
let fulai = new SetMaomi();
fulai instanceof SetMaomi // true
// 函数
function getMaomi() {}
getMaomi instanceof Function // true
1.3 涉及的构造函数
- 基础类型:String、Number、 Boolean、 Undefind、Null、Symbol
- 引用类型:Object(Array、RegExp、Date、Function...)
1.3 实现原理
instanceof 的内部实现机制是:通过判断对象的原型链上是否能找到对象的 prototype
,来确定 instanceof
返回值。
function instance_of(L, R) {
var O = R.prototype;
L = L.__proto__;
while (true) {
if (L === null)
return false;
if (O === L)
return true;
L = L.__proto__;
}
}
代码释义:
① L表示对象实例,R表示构造函数或者父类型实例
② 取R的显式原型,取L的隐式原型
③ 循环遍历,进行判断②中的两个值是否相等,相等返回true,不相等继续查找L的原型链
instanceof
运算符用来检测 constructor.prototype
是否存在于参数 object
的原型链上。
- 示例:
function SetMaomi() {}
let fulai = new SetMaomi();
fulai instanceof SetMaomi
观察fulai.__proto__
和SetMaomi.prototype
的结构:
注意点:
fulai instanceof SetMaomi
返回true
,则并不意味着该表达式会永远返回true
。SetMaomi.prototype
属性的值有可能会改变,改变之后的值很有可能不存在于fulai
的原型链上,这时原表达式的值就会成为false
二、instanceof产生继承关系
function Cat(name,age,type){
this.name = name;
this.age = age;
this.type = type;
}
function YingDuan(name,age,type,sex){
Cat.call(this,name,age,type);
this.sex = sex;
}
YingDuan.prototype = new Cat(); // 这里改变了原型指向,实现继承
var yd = new YingDuan("有鱼",2,"金渐层","男"); //创建了英短对象yd
console.log(yd instanceof YingDuan); // true
console.log(yd instanceof Cat); // true
console.log(yd instanceof Object); // true
下面为了直观的观察,我就不采用循环的方式,直接一个一个的打印出来:
yd instanceof YingDuan
:yd instanceof Cat
:yd instanceof Object
:
三、注意问题
fulai instanceof SetMaomi
返回true
,则并不意味着该表达式会永远返回true
。SetMaomi.prototype
属性的值有可能会改变,改变之后的值很有可能不存在于fulai
的原型链上,这时原表达式的值就会成为false
- instanceof 用于判断对象类型,但以下情况的结果都为false,请注意。
console.log(Number instanceof Number) // false
console.log(String instanceof String) // false
console.log(null instanceof Object) // false,null不具有任何对象的特性,也没有__proto__属性
参考
作者:旺仔小猪
来源:juejin.cn/post/7293348107517001739
来源:juejin.cn/post/7293348107517001739