typeof和instanceof的区别

typeof 和 instanceof 是 JavaScript 中用于类型检测的两个操作符，但它们的用途和机制有明显区别：

---

1. typeof

• 用途：检测变量的基本数据类型（返回类型字符串）。
• 返回值：表示类型的字符串（如 "number", "string", "boolean" 等）。
• 适用对象：基本数据类型（如 number, string, boolean）和 function。
• 局限性：
  • 无法准确判断对象的具体类型（如数组、日期等对象会统一返回 "object"）。
  • typeof null 会返回 "object"（历史遗留问题）。

typeof 42;          // "number"
typeof "hello";     // "string"
typeof true;        // "boolean"
typeof undefined;   // "undefined"
typeof function(){};// "function"
typeof {};          // "object"（普通对象）
typeof [];          // "object"（数组）
typeof null;        // "object"（陷阱！）

---

2. instanceof

• 用途：检测对象是否是某个构造函数的实例（基于原型链）。
• 返回值：布尔值（true 或 false）。
• 适用对象：对象类型（如数组、自定义对象等）。
• 机制：检查对象的原型链中是否存在构造函数的 prototype 属性。
• 局限性：
  • 无法检测基本数据类型（如 42 instanceof Number 返回 false）。
  • 跨全局环境（如 iframe）可能失效，因为原型链不共享。

[] instanceof Array;          // true
{} instanceof Object;          // true
new Date() instanceof Date;   // true

function Person() {}
const p = new Person();
p instanceof Person;           // true

42 instanceof Number;         // false（基本类型）
new Number(42) instanceof Number; // true（包装对象）

---

关键区别

特性	typeof	instanceof
操作对象	基本数据类型、函数	对象类型
返回值	类型字符串（如 "string"）	布尔值（true/false）
检测方式	直接判断值的类型	沿原型链查找构造函数
适用场景	检测基本类型或函数	检测对象的具体类型（如数组、日期）
局限性	无法区分对象的具体类型	无法检测基本类型

---

如何互补使用？

1. 基本类型检测：优先用 typeof。

   if (typeof value === "string") { ... }
   

2. 对象类型检测：用 instanceof 或更精确的方法（如 Array.isArray()）。

   if (arr instanceof Array) { ... }
   // 或
   if (Array.isArray(arr)) { ... }
   

3. 通用类型检测：结合使用（或使用 Object.prototype.toString.call()）。

   Object.prototype.toString.call([]); // "[object Array]"
   

---

总结

• typeof：快速判断基本类型和函数，但对对象类型不敏感。
• instanceof：判断对象的具体类型，依赖原型链。
• 根据场景灵活选择，必要时结合其他方法（如 Array.isArray()）。