JavaScript如何判断array和object

JavaScript如何判断array和object

在 JavaScript 中，数组（Array）和对象（Object）都是复杂数据类型，但它们的使用场景和特性不同。以下是判断一个变量是数组还是对象的几种方法：

1. 使用 Array.isArray()

• 作用：

  • 判断一个变量是否为数组。

const arr = [1, 2, 3];
const obj = { a: 1, b: 2 };

console.log(Array.isArray(arr)); // 输出: true
console.log(Array.isArray(obj)); // 输出: false

2. 使用 instanceof

• 作用：

  • 判断一个变量是否为某个构造函数的实例。

const arr = [1, 2, 3];
const obj = { a: 1, b: 2 };

console.log(arr instanceof Array); // 输出: true
console.log(obj instanceof Array); // 输出: false
console.log(obj instanceof Object); // 输出: true

3. 使用 Object.prototype.toString.call()

• 作用：

  • 返回变量的类型字符串，可以准确判断数组和对象。

const arr = [1, 2, 3];
const obj = { a: 1, b: 2 };

console.log(Object.prototype.toString.call(arr)); // 输出: [object Array]
console.log(Object.prototype.toString.call(obj)); // 输出: [object Object]

4. 使用 typeof（不推荐）

• 作用：

  • 返回变量的数据类型，但无法区分数组和对象。

const arr = [1, 2, 3];
const obj = { a: 1, b: 2 };

console.log(typeof arr); // 输出: object
console.log(typeof obj); // 输出: object

5. 使用 constructor

• 作用：

  • 判断变量的构造函数。

const arr = [1, 2, 3];
const obj = { a: 1, b: 2 };

console.log(arr.constructor === Array); // 输出: true
console.log(obj.constructor === Object); // 输出: true

6. 使用 Object.prototype.isPrototypeOf()

• 作用：

  • 判断一个对象是否在另一个对象的原型链上。

const arr = [1, 2, 3];
const obj = { a: 1, b: 2 };

console.log(Array.prototype.isPrototypeOf(arr)); // 输出: true
console.log(Object.prototype.isPrototypeOf(obj)); // 输出: true

总结

方法	优点	缺点
Array.isArray()	简单直接，推荐使用	仅适用于判断数组
instanceof	可以判断多种类型	跨框架时可能不准确
Object.prototype.toString.call()	准确判断类型	语法稍复杂
typeof	简单	无法区分数组和对象
constructor	可以判断构造函数	可能被修改，不可靠
Object.prototype.isPrototypeOf()	可以判断原型链关系	语法稍复杂

根据具体需求选择合适的方法，可以准确判断变量是数组还是对象。推荐使用 Array.isArray() 判断数组，使用 Object.prototype.toString.call() 判断对象。

更多vue相关插件及后台管理模板可访问vue admin reference，代码详情请访问github