js判断数组相同

梗概

在JavaScript中判断两个数组是否相同有多种方法，不同方法适用于不同场景和数组类型。选择合适的方法需要考虑数组元素类型、性能要求以及比较的精确度。

比较方法分类

1. 简单数组比较

转字符串比较法

适用于仅包含基本数据类型（字符串、数字、布尔值）的数组：

// 方法1：使用JSON.stringify
const isEqual1 = (arr1, arr2) => JSON.stringify(arr1) === JSON.stringify(arr2);
 
// 方法2：使用join
const isEqual2 = (arr1, arr2) => arr1.join(',') === arr2.join(',');

注意：使用join方法时建议添加分隔符，避免[1,2]和[12]被误判为相等。

使用every方法比较

利用数组的every()方法逐元素比较：

const isArrEqual = (arr1, arr2) => {
  return arr1.length === arr2.length && 
         arr1.every((ele, index) => Object.is(ele, arr2[index]));
};

这种方法的优点是可以正确处理NaN的比较，因为Object.is()与全等（===）的主要区别是：

• Object.is(NaN, NaN) 返回 true
• Object.is(-0, +0) 返回 false

2. 多维数组比较

打平后比较

对于多维数组，可以先使用flat()方法将数组打平，再进行比较：

const isEqual = (arr1, arr2) => {
  const flatArr1 = arr1.flat(Infinity);
  const flatArr2 = arr2.flat(Infinity);
  
  return flatArr1.length === flatArr2.length && 
         flatArr1.every((ele, index) => Object.is(ele, flatArr2[index]));
};

递归比较

针对嵌套结构更复杂的数组，可以使用递归方法：

function areArraysEqual(arr1, arr2) {
  if (arr1.length !== arr2.length) return false;
  
  for (let i = 0; i < arr1.length; i++) {
    if (Array.isArray(arr1[i]) && Array.isArray(arr2[i])) {
      if (!areArraysEqual(arr1[i], arr2[i])) return false;
    } else if (!Object.is(arr1[i], arr2[i])) {
      return false;
    }
  }
  
  return true;
}

3. 对象数组比较

对于包含对象的数组，需要进行深度比较：

const isDeepEqual = (arr1, arr2) => {
  if (arr1.length !== arr2.length) return false;
  
  return arr1.every((item, index) => {
    if (typeof item !== typeof arr2[index]) return false;
    
    if (typeof item === 'object' && item !== null) {
      if (Array.isArray(item) && Array.isArray(arr2[index])) {
        return isDeepEqual(item, arr2[index]);
      }
      return JSON.stringify(item) === JSON.stringify(arr2[index]);
    }
    
    return Object.is(item, arr2[index]);
  });
};

相关：js判断对象相同

注意事项

1. 使用JSON.stringify的局限性

• 无法处理循环引用，会导致错误
• 会忽略undefined、function等值
• 对象属性的顺序可能影响结果
• 不能正确区分-0和+0
• 相关：循环引用引起JSON.stringify错误

2. 比较运算符的差异

• 与=的区别：==会进行类型转换，===不会
• Object.is()与===的区别在于特殊值（如NaN、-0和+0）的处理方式
• 相关：两等号的类型转换规则

3. 性能考虑

• 对于简单数组，使用every方法通常比较高效
• 对于大型数组，JSON.stringify可能会有性能问题
• 多维数组打平操作会创建新数组，可能会消耗较多内存
• 对于频繁比较的场景，可以考虑使用第三方库如lodash的_.isEqual

4. 相关应用

• 数组操作：数组差集、判断子集
• 判断方法：数组的some()方法、判断数组元素相同

最佳实践建议

1. 简单数组比较：优先使用every方法
2. 需要处理NaN情况：使用Object.is而非===
3. 对象数组：使用深度比较或考虑第三方库
4. 对性能敏感场景：避免不必要的JSON.stringify和数组打平操作