深入剖析 JavaScript 中 typeof 与 instanceof 的类型判断异同

typeof：一窥变量数据类型

typeof 运算符用于检查变量当前所保存的数据类型，它返回一个字符串，表示该变量所保存的值的类型。

举个例子：

console.log(typeof 1); // "number"
console.log(typeof "Hello"); // "string"
console.log(typeof true); // "boolean"
console.log(typeof undefined); // "undefined"
console.log(typeof null); // "object"

可以看到，typeof 运算符可以准确地识别出不同类型的数据，包括数字、字符串、布尔值、undefined 和 null。但是，值得注意的是，typeof 运算符将 null 的类型识别为 "object"，这是因为它在早期版本的 JavaScript 中被设计为一个对象。

instanceof：揭示对象继承关系

instanceof 运算符用于检查一个对象是否属于某个类的实例。它返回一个布尔值，表示该对象是否属于该类或其子类。

class Person {
  constructor(name) {
    this.name = name;
  }
}

class Student extends Person {
  constructor(name, grade) {
    super(name);
    this.grade = grade;
  }
}

const person = new Person("John");
const student = new Student("Mary", 10);

console.log(person instanceof Person); // true
console.log(student instanceof Person); // true
console.log(student instanceof Student); // true

在上面的例子中，instanceof 运算符可以正确地识别出 person 和 student 对象的类型，并判断它们是否属于 Person 类或 Student 类。

typeof 与 instanceof 的异同

从上面的例子中，我们可以看出 typeof 和 instanceof 运算符在类型判断方面有以下异同：

• 异同点：

  • typeof 和 instanceof 运算符都可以用于类型判断。
  • typeof 和 instanceof 运算符都可以返回一个布尔值或字符串。

• 不同点：

  • typeof 运算符用于检查变量当前所保存的数据类型，而 instanceof 运算符用于检查一个对象是否属于某个类的实例。
  • typeof 运算符返回一个字符串，表示该变量所保存的值的类型，而 instanceof 运算符返回一个布尔值，表示该对象是否属于该类或其子类。
  • typeof 运算符可以用于任何数据类型，而 instanceof 运算符只能用于对象。

什么时候使用 typeof，什么时候使用 instanceof？

在实际开发中，我们通常会根据不同的情况来选择使用 typeof 或 instanceof 运算符。

• 使用 typeof 运算符的情况：

  • 当我们需要检查一个变量当前所保存的数据类型时。
  • 当我们需要对不同类型的数据进行不同的处理时。

• 使用 instanceof 运算符的情况：

  • 当我们需要检查一个对象是否属于某个类的实例时。
  • 当我们需要判断一个对象是否具有某个类的原型时。

总结

typeof 和 instanceof 运算符都是 JavaScript 中用于类型判断的运算符，但它们的工作方式和应用场景却有所不同。typeof 运算符用于检查变量当前所保存的数据类型，而 instanceof 运算符用于检查一个对象是否属于某个类的实例。在实际开发中，我们通常会根据不同的情况来选择使用 typeof 或 instanceof 运算符。