探究 JavaScript 类型检查的利器：typeof 和 instanceof

🤍 前端开发工程师（主业）、技术博主（副业）、已过CET6
🍨 阿珊和她的猫_CSDN个人主页
🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》
🍚 蓝桥云课签约作者、已在蓝桥云课上架的前后端实战课程《Vue.js 和 Egg.js 开发企业级健康管理项目》、《带你从入门到实战全面掌握 uni-app》

1. 引言

介绍 JavaScript 中的类型检查

在 JavaScript 中，类型检查是一种用于确定变量或对象的数据类型的技术。它可以帮助开发者确保代码的正确性和一致性，并避免潜在的错误。

在 JavaScript 中，有两种常见的类型检查方法：typeof操作符和instanceof操作符。

1. typeof操作符用于检查一个变量的数据类型。它返回一个字符串，表示该变量的类型。例如：

let num = 5;
console.log(typeof num); 

在这个例子中，typeof num将返回"number"，因为num是一个数字类型的变量。

2. instanceof操作符用于检查一个对象是否是某个特定类的实例。它需要一个对象和一个类作为参数，并返回一个布尔值，表示该对象是否为该类的实例。例如：

let obj = new Date();
console.log(obj instanceof Date); 

在这个例子中，obj instanceof Date将返回true，因为obj是一个Date类的实例。

需要注意的是，类型检查并不能完全保证代码的正确性，因为 JavaScript 是一种动态类型的语言，变量的类型可以在运行时改变。因此，类型检查应该与其他编程技术（如错误处理、单元测试等）结合使用，以确保代码的可靠性和稳定性。

2. typeof 操作符

定义和用法

typeof操作符是 JavaScript 中的一个一元操作符，用于获取一个变量或表达式的数据类型。

typeof操作符的语法如下：

typeof expression

其中，expression是要检查的数据。

typeof操作符会返回一个字符串，表示被检查数据的类型。以下是一些常见的返回值：

• "number"：如果expression是一个数字。
• "string"：如果expression是一个字符串。
• "boolean"：如果expression是一个布尔值。
• "object"：如果expression是一个对象（包括数组、函数等）。
• "function"：如果expression是一个函数。
• "undefined"：如果expression未定义。
• "symbol"（ECMAScript 2015 及更高版本）：如果expression是一个符号。

示例：

let num = 5;
console.log(typeof num); let str = "Hello, World!";
console.log(typeof str); let bool = true;
console.log(typeof bool); let obj = { name: "John" };
console.log(typeof obj); let func = function() {};
console.log(typeof func); let sym = Symbol("mySymbol");
console.log(typeof sym); 

在这些示例中，typeof操作符返回了被检查数据的类型。

需要注意的是，typeof操作符对于基本类型（如数字、字符串、布尔值等）可以准确地返回其类型，但对于对象类型（如数组、函数等），它只能返回"object"。如果需要更准确地检查对象的类型，可以使用instanceof操作符或其他方法。

讨论typeof 的局限性

typeof操作符是 JavaScript 中的一种简单类型检查工具，它可以返回一个字符串，表示变量的数据类型。虽然typeof操作符非常方便，但它也有一些局限性。

首先，typeof操作符只能确定基本数据类型，对于复杂的数据类型（如对象、数组、函数等），它只能返回"object"。这意味着，如果你想确定一个变量是否为特定的对象类型（如Array或Date），你需要使用其他方法，如instanceof操作符或对象的toString方法。

其次，typeof操作符不能正确处理所有的类型转换。例如，对于null值，typeof操作符会返回"object"，而不是"null"。对于undefined值，typeof操作符也会返回"undefined"，而不是"object"或其他类型。

最后，typeof操作符不能检测变量的具体值，只能检测变量的数据类型。如果你想检查变量的值是否符合某个条件，你需要使用其他方法，如if语句或switch语句。

尽管typeof操作符有这些局限性，但它仍然是一种非常有用的类型检查工具，特别是在处理基本数据类型时。在使用typeof操作符时，你应该了解它的局限性，并根据需要使用其他类型检查方法来确保代码的正确性和可读性。

3. instanceof 操作符

定义和用法

instanceof操作符是 JavaScript 中的一个二元运算符，用于检查一个对象是否是某个特定类的实例。

instanceof操作符的语法如下：

obj instanceof constructor

其中，obj是要检查的对象，constructor是一个函数或构造函数对象。

instanceof操作符会返回一个布尔值，表示obj是否为constructor的实例。如果obj是constructor的实例，则返回true；否则返回false。

示例：

let obj = new Date();
console.log(obj instanceof Date); let arr = [5, 10, 15];
console.log(arr instanceof Array); 

在这些示例中，instanceof操作符检查了对象obj是否为Date类的实例，以及数组arr是否为Array类的实例。

需要注意的是，instanceof操作符基于对象的原型链进行检查，因此它不仅可以检查对象是否直接由某个类创建，还可以检查对象是否继承自该类。

instanceof操作符的一个常见用途是用于判断对象的类型，以便进行类型检查和类型转换。但需要注意的是，它不能检查基本类型（如数字、字符串等），因为基本类型不是对象，没有原型链。

示例：使用 instanceof 检查对象的类型

以下是一些示例，演示如何使用instanceof操作符来检查对象的类型：

// 创建一个 Date 对象
let obj = new Date();// obj 是 Date 类的实例，所以 instanceof 操作符返回 true
console.log(obj instanceof Date); // 创建一个数组对象
let arr = [5, 10, 15];// arr 是 Array 类的实例，所以 instanceof 操作符返回 true
console.log(arr instanceof Array); // 创建一个自定义类的实例
class CustomClass {constructor() {this.name = "CustomClass";}
}let customObj = new CustomClass();// customObj 是 CustomClass 类的实例，所以 instanceof 操作符返回 true
console.log(customObj instanceof CustomClass); // 创建一个对象，该对象不是任何类的实例
let obj2 = { };// obj2 不是任何类的实例，所以 instanceof 操作符返回 false
console.log(obj2 instanceof Date); 
console.log(obj2 instanceof Array); 
console.log(obj2 instanceof CustomClass); 

在这些示例中，使用instanceof操作符来检查对象是否是特定类的实例。如果对象是该类的实例，则instanceof操作符返回true；否则返回false。

请注意，instanceof操作符基于对象的原型链进行类型检查，因此它可以检查对象是否继承自某个类。这在判断对象类型和进行类型转换时非常有用。

比较 instanceof 和typeof 的区别

instanceof和typeof是 JavaScript 中用于检查对象类型的操作符，但它们之间有一些区别。

1. typeof操作符可以用于检查任何类型的变量，包括基本类型和对象类型。它返回一个字符串，表示变量的数据类型。对于基本类型，它返回相应的基本类型名称（如"number"、“string”、“boolean"等）；对于对象类型，它返回"object”。

   示例：

   console.log(typeof 5); 
   console.log(typeof "Hello, World!"); 
   console.log(typeof true); 
   console.log(typeof null); 
   console.log(typeof {}); 
   console.log(typeof function() {});
   

2. instanceof操作符只能用于检查对象类型，它返回一个布尔值，表示一个对象是否为特定类的实例。它需要一个构造函数或函数对象作为参数，并将待检查的对象作为操作数。

   示例：

   class CustomClass {constructor() {this.name = "CustomClass";}
   }let obj = new CustomClass();
   console.log(obj instanceof CustomClass); let arr = [5, 10, 15];
   console.log(arr instanceof Array); 
   

总结：

• typeof操作符可以检查任何类型的变量，并返回一个字符串表示变量的类型。
• instanceof操作符只能用于检查对象类型，并返回一个布尔值，表示对象是否为特定类的实例。
• instanceof操作符基于对象的原型链进行检查，而typeof操作符则直接根据变量的类型进行检查。

在实际应用中，根据需要选择合适的操作符来检查对象的类型。如果只需要知道变量的基本类型，可以使用typeof；如果需要确定对象是否为特定类的实例，可以使用instanceof。