JavaScript typeof与instanceof的区别

😉 你好呀，我是爱编程的Sherry，很高兴在这里遇见你！我是一名拥有十多年开发经验的前端工程师。这一路走来，面对困难时也曾感到迷茫，凭借不懈的努力和坚持，重新找到了前进的方向。我的人生格言是——认准方向，坚持不懈，你终将迎来辉煌！欢迎关注我😁，我将在这里分享工作中积累的经验和心得，希望我的分享能够给你带来帮助。

typeof 和 instanceof 都是 JavaScript 中的运算符，用于检查数据类型或对象的类型。它们有不同的用途和适用场景，下面我们就来详细地讲讲它们。

typeof

作用

返回变量的数据类型，适用于原始数据类型（如 number、string、boolean 等）。

使用场景

判断一个变量是否为基本类型，如 undefined、number、string、boolean、object（包括 null）、function 等。

举个栗子

console.log(typeof 42); // "number"
console.log(typeof "Hello"); // "string"
console.log(typeof undefined); // "undefined"
console.log(typeof {}); // "object"
console.log(typeof null); // "object"
console.log(typeof []); // "object"
console.log(typeof console); // "object"
console.log(typeof console.log); // "function"

注意

对于数组和 null，typeof 会返回 “object”，因此不适合用于区分复杂对象。如果你需要在 if 语句中判断是否为null，直接通过 ===null 来判断就好。如果我们要判断一个变量是否存在，可以使用 typeof ：（不要使用 if(a)，若 a 未声明，则报错）

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

instanceof

作用

用于检测一个对象是否是某个构造函数的实例，适用于引用数据类型（如 Array、Function、自定义对象等）。

使用场景

判断某个对象是否继承自某个构造函数的原型链，用于复杂对象类型的判断。

举个栗子

console.log([] instanceof Array); // true
console.log({} instanceof Object); // true
console.log(function(){} instanceof Function); // true
console.log(Object instanceof constructor); // true

Object 为实例对象，constructor 为构造函数，构造函数通过new可以实例对象，instanceof 能判断这个对象是否是之前那个构造函数生成的对象。

// 定义构造函数
let Car = function() {}
let benz = new Car()
console.log(benz instanceof Car); // true
let car = new String('xxx');
console.log(car instanceof String); // true
let str = 'xxx';
console.log(str instanceof String); // false

注意

instanceof 适用于对象和类的关系检测，无法用于基本类型的判断。

区别：

• typeof 更适合基本类型的检测，而 instanceof 适合检测对象的原型链。
• typeof 是单一操作符，不需要参数，instanceof 是用于检测对象的构造函数匹配。

使用建议：

• 如果需要判断一个变量的 基本类型，用 typeof。
• 如果判断变量是某个 类的实例，用 instanceof。