typeof 与 instanceof 运算符

Posted 2021-03-26 edwardwzw

相信很多伙伴们在刚刚入门js的时候，都会遇到 typeof 与 instanceof 在用法上的一些个困惑，今天小编就要和大家聊一聊它们各自的用法以及一些区别，

您先别急，咱下面就来分别讲解：

 

js是一门弱语言，它在声明变量时无需确定变量的类型，js在运行时会自动判断。

 

typeof 

用来检测一个变量的类型,  返回值是一个字符串。

使用方式：typeof(表达式)和 typeof 变量名

运算符返回值：字符串，有七种可能："undefined" ，"number" ，"string"，"boolean" ，"object" ，"function" ，"symbol"

 

typeof  undefined // "undefined"

typeof 1 // "number"

typeof "1" // "string"

typeof false // "boolean"

typeof {} // "object"

typeof [] // "object"

typeof null // "object"

typeof function () {} // "function"

typeof Symbol(1) // "symbol"

 

（注意：对象、数组、null的typeof返回值都是”object”）

如果我们想判断一个变量类型是否是数组，建议使用：Array.isArray([]) // true 来判断

 

instanceof

用来检测一个对象在其原型链中是否存在一个构造函数的 prototype 属性。

语法：[对象] instanceof [构造函数]

 (注意：左侧必须是对象，如果不是，则直接返回 false)

let num = 1
num instanceof Number // false

num = new Number(1)
num instanceof Number // true

看到这里，有人可能要问，明明都是num 且都是1,为什么返回的结果却不同呢？

其实，第一个不是对象，而是基本类型，而第二个是封装成对象，所以为true。同理：

var a = new Array();
console.log(a instanceof Array); // true
console.log(a instanceof Object); // true   -----------因为 Array 是 Object 的子类


function test(){};
var a = new test();
console.log(a instanceof test) // true

 

此外，instanceof 可以在继承关系中用来判断一个实例是否属于它的父类型。如：

function Fn() {};  
function Foo() {};
Foo.prototype = new Fn();
var foo = new Foo();
console.log(foo instanceof Foo); // true
console.log(foo instanceof Fn);  // true

Foo.prototype = {};
var foo2 = new Foo();
console.log(foo2 instanceof Foo); // true
console.log(foo instanceof Foo); // false  ---------Foo.prototype指向了一个空对象，这个空对象不在foo的原型链上。