JavaScript 数组比较完全指南：浅比较·深比较·无序比较

EndingCoder

于 2025-05-14 14:01:14 发布

阅读量894

点赞数 20

分类专栏： JavaScript 文章标签： javascript

本文链接：https://blog.csdn.net/zimin1985/article/details/147952682

版权

JavaScript 专栏收录该内容

44 篇文章

订阅专栏

摘要

在 JavaScript 中，直接使用 == 或 === 比较两个数组只能判断它们是否引用同一对象，而无法按“值”比较元素内容。要想判断两个数组内容一致，必须使用 值比较 的方法，常见方案包括：将数组序列化后比较（JSON.stringify）；手动逐项遍历比较（如 for 循环、every + includes）；或者构建元素计数映射（frequency map）实现 O(n) 复杂度的无序比较。在大型或性能敏感场景，也可借助 Lodash 的 _.isEqual 进行深度比较。

1. 为什么直接比较失败

JavaScript 中，数组属于引用类型，==/=== 比较的是内存地址，而不是元素内容：

const a = [1,2,3];
const b = [1,2,3];
console.log(a === b); // false

即便内容相同，只要不是同一实例，比较结果必然 false 。

2. `JSON.stringify` 序列化比较

最简单的“值”比较是先将数组转换为 JSON 字符串，再进行比较：

JSON.stringify(a) === JSON.stringify(b);  // true

优点：一行代码即可对 基本类型、嵌套对象/数组进行浅层比较。
缺点：对函数、undefined、NaN 等不可 JSON 序列化类型无效；顺序敏感，[2,3] 与 [3,2] 会被视作不同。

3. 手动逐项比较

当只需对基本类型数组进行逐项检查时，可用循环或高阶方法：

3.1 `for` 循环

function equals(a, b) {
  if (a.length !== b.length) return false;
  for (let i = 0; i < a.length; i++) {
    if (a[i] !== b[i]) return false;
  }
  return true;
}

优点：最直观、开销仅 O(n)。
缺点：代码冗长，不支持深度比较。

3.2 `every` + `includes`

function equals(a, b) {
  return a.length === b.length && a.every(val => b.includes(val));
}

原理：every 会在回调返回 false 时提前停止，适合元素存在性检查MDN Web Docs。
注意：此法只能判断两个数组是否包含相同元素，不考虑顺序，也不适合含重复元素的场景。

4. 无序数组深度比较（频率映射）

若数组顺序可以不同，但需考虑重复次数，可用 frequency map：

function equalsUnordered(a, b) {
  if (a.length !== b.length) return false;
  const freq = new Map();
  for (const x of a) freq.set(x, (freq.get(x) || 0) + 1);
  for (const x of b) {
    if (!freq.has(x)) return false;
    freq.set(x, freq.get(x) - 1);
    if (freq.get(x) < 0) return false;
  }
  return true;
}