typeof 和 instanceof有什么区别

typeof 和 instanceof 都是 JavaScript 中用于类型检查的操作符，但它们的用途和工作方式不同：

1. typeof 操作符

作用 ：返回一个字符串，表示未经计算的操作数的类型。

typeof 42;              // "number"
typeof "hello";         // "string"
typeof true;            // "boolean"
typeof undefined;       // "undefined"
typeof null;            // "object" (历史遗留bug)
typeof {};              // "object"
typeof [];              // "object"
typeof function() {};   // "function"
typeof Symbol();        // "symbol"
typeof 123n;            // "bigint"

特点：

• 主要用于判断基本数据类型
• 对于对象类型，除了函数返回 "function"，其他都返回 "object"
• typeof null 返回 "object" 是著名的 JavaScript 设计缺陷

2. instanceof 操作符

作用 ：检查构造函数的 prototype 属性是否出现在对象的原型链上。

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

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

特点：

• 主要用于判断对象的具体类型（是哪个类的实例）
• 沿着原型链向上查找
• 只能用于对象，对基本数据类型无效

主要区别

特性	typeof	instanceof
返回类型	字符串	布尔值
主要用途	判断基本数据类型	判断对象的具体类型
对基本类型	有效	无效（返回 false）
对null	返回 "object"	报错（null不是对象）
对数组	返回 "object"	可判断 Array
原理	检查值的类型标签	检查原型链

使用示例对比

// 基本类型
typeof 123;           // "number"
123 instanceof Number; // false (原始类型)

typeof "abc";         // "string"
"abc" instanceof String; // false

// 对象类型
typeof [];            // "object"
[] instanceof Array;  // true

typeof {};            // "object"
{} instanceof Object; // true

// 函数
typeof function() {}; // "function"
(function() {}) instanceof Function; // true

// 特殊案例
typeof null;          // "object" ❌
null instanceof Object; // false

const num = new Number(123);
typeof num;           // "object"
num instanceof Number; // true

实际应用建议

1. 判断基本类型 ：使用 typeof

if (typeof value === 'string') { /* ... */ }

2. 判断数组 ：使用 Array.isArray()（最可靠）

Array.isArray([]);  // true

3. 判断自定义对象类型 ：使用 instanceof

if (obj instanceof MyClass) { /* ... */ }

4. 综合判断：可以结合使用

function getType(value) {
  if (value === null) return 'null';
  if (Array.isArray(value)) return 'array';
  const type = typeof value;
  if (type !== 'object') return type;
  return value.constructor.name.toLowerCase();
}

注意事项

1. instanceof 在跨框架（iframe）时可能不可靠，因为不同全局环境的构造函数不同
2. 使用 Symbol.hasInstance 可以自定义 instanceof 的行为
3. 对于精确的类型判断，可以使用 Object.prototype.toString.call()

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