如何精准区分 JavaScript 数据类型：巧用 instanceof、typeof、Object.prototype.toString.call()

2023-09-12 13:09:59

3月面试实录：深入剖析技术难题

在 JavaScript 的世界中，数据类型是至关重要的概念，直接影响着程序的运行效率和代码的健壮性。因此，精准区分不同类型的数据是程序员的基本功之一。本文将深入剖析 JavaScript 中三种常用的数据类型区分方法：instanceof、typeof 和 Object.prototype.toString.call()，帮助开发者掌握精准识别数据类型的高效技巧。

instanceof：基于原型链的类型检查

instanceof 运算符用于判断一个对象是否属于某个类或其子类，本质上是基于原型链的类型检查。它通过比较对象的原型链与指定类的 prototype 属性，来确定对象是否属于该类。

语法：

object instanceof Class

适用场景：

instanceof 适用于需要检查对象是否属于特定类的场景，尤其是当对象可能存在多重继承时。

示例：

// 创建一个 Person 类
function Person(name) {
  this.name = name;
}

// 创建一个 Student 类，继承 Person 类
function Student(name, grade) {
  Person.call(this, name);
  this.grade = grade;
}

// 实例化一个 Student 对象
const student = new Student("John", 90);

// 检查 student 是否属于 Person 类
console.log(student instanceof Person); // true

// 检查 student 是否属于 Student 类
console.log(student instanceof Student); // true

typeof：内置类型检查

typeof 运算符用于返回一个值的原始类型，包括基本类型（例如字符串、数字、布尔值）和引用类型（例如对象、数组、函数）。

语法：

typeof value

适用场景：

typeof 适用于需要快速获取值原始类型的情况，例如调试或类型转换。它也可以用于检查值是否为 null 或 undefined。

示例：

console.log(typeof "Hello"); // "string"
console.log(typeof 123); // "number"
console.log(typeof true); // "boolean"
console.log(typeof [1, 2, 3]); // "object"
console.log(typeof null); // "object"
console.log(typeof undefined); // "undefined"

Object.prototype.toString.call()：万能类型检查

Object.prototype.toString.call() 方法返回一个对象的内部表示，其格式为 "[object Type]"，其中 Type 代表对象的类型。

语法：

Object.prototype.toString.call(value)

适用场景：

Object.prototype.toString.call() 是最万能的数据类型检查方法，因为它可以处理任何值，包括基本类型、引用类型和自建类型。

示例：

console.log(Object.prototype.toString.call("Hello")); // "[object String]"
console.log(Object.prototype.toString.call(123)); // "[object Number]"
console.log(Object.prototype.toString.call(true)); // "[object Boolean]"
console.log(Object.prototype.toString.call([1, 2, 3])); // "[object Array]"
console.log(Object.prototype.toString.call(null)); // "[object Null]"
console.log(Object.prototype.toString.call(undefined)); // "[object Undefined]"