处理 JavaScript 数组中的重复项：技术和最佳实践-js教程-PHP中文网

处理 JavaScript 数组中的重复项：技术和最佳实践

Linda Hamilton

发布： 2024-10-23 17:54:30

原创

423 人浏览过

Handling Duplicates in JavaScript Arrays: Techniques and Best Practices

在 JavaScript 开发中，有效管理数据至关重要。开发人员面临的一项常见挑战是处理数组中的重复值。本文将探讨识别和消除重复项的不同方法，重点关注简单数组和对象数组。

理解数组中的重复项

使用数组时，重复可能会导致错误的结果、低效的处理或应用程序中的意外行为。因此，必须实施强大的策略来有效过滤掉重复项。

1.从简单数组中删除重复项

让我们从一个简单的例子开始。假设您有一个包含重复项的数字数组：

let numberArray = [1, 2, 3, 3, 4, 5, 6, 5, 7, 10, 9, 9];
let uniqueNumbers = [];

for (let i = 0; i < numberArray.length; i++) {
  let isDuplicate = false;

  for (let j = 0; j < uniqueNumbers.length; j++) {
    if (numberArray[i] === uniqueNumbers[j]) {
      isDuplicate = true;
      break;
    }
  }

  if (!isDuplicate) {
    uniqueNumbers.push(numberArray[i]);
  }
}

console.log(uniqueNumbers); // Output: [1, 2, 3, 4, 5, 6, 7, 10, 9]

登录后复制

说明：

外循环： 迭代原始数组 (numberArray) 中的每个元素。
内循环： 检查当前元素是否已存在于 uniqueNumbers 数组中。如果是，它将 isDuplicate 标志设置为 true 并跳出内部循环。
条件：如果元素不重复，则将其添加到 uniqueNumbers 中。

虽然这种方法有效，但由于其时间复杂度为 O(n²)，因此对于较大的数据集来说并不是最佳选择，这会降低性能。

2.处理对象数组中的重复项

处理对象数组时，您可能希望根据特定属性（例如 id 字段）删除重复项。以下是说明如何实现此目的的示例：

let userArray = [
  { id: 1, name: 'John' },
  { id: 2, name: 'Jane' },
  { id: 3, name: 'Bob' },
  { id: 3, name: 'Bob' }, // Duplicate
  { id: 4, name: 'Alice' },
  { id: 5, name: 'Eve' },
  { id: 5, name: 'Eve' }, // Duplicate
  { id: 6, name: 'Charlie' },
  { id: 7, name: 'David' },
  { id: 10, name: 'Edward' },
  { id: 9, name: 'Frank' },
  { id: 9, name: 'Frank' } // Duplicate
];

let uniqueUsers = [];

for (let i = 0; i < userArray.length; i++) {
  let isDuplicate = false;

  // Compare based on the 'id' property
  for (let j = 0; j < uniqueUsers.length; j++) {
    if (userArray[i].id === uniqueUsers[j].id) {
      isDuplicate = true;
      break;
    }
  }

  // If it's not a duplicate, add the object to the unique array
  if (!isDuplicate) {
    uniqueUsers.push(userArray[i]);
  }
}

console.log(uniqueUsers);

登录后复制

说明：

此代码遵循与前面示例类似的逻辑，但它根据数组中对象的 id 属性检查重复项。

3.删除重复项的最佳方法

对于较大的数据集，更有效的方法是使用地图或对象来跟踪看到的标识符。这是一个改进的示例：

let numberArray = [1, 2, 3, 3, 4, 5, 6, 5, 7, 10, 9, 9];
let uniqueNumbers = [];

for (let i = 0; i < numberArray.length; i++) {
  let isDuplicate = false;

  for (let j = 0; j < uniqueNumbers.length; j++) {
    if (numberArray[i] === uniqueNumbers[j]) {
      isDuplicate = true;
      break;
    }
  }

  if (!isDuplicate) {
    uniqueNumbers.push(numberArray[i]);
  }
}

console.log(uniqueNumbers); // Output: [1, 2, 3, 4, 5, 6, 7, 10, 9]

登录后复制