Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> JavaScript

Tìm và xóa phần tử trùng lặp trong mảng JavaScript (Set & Filter)

ES6 cung cấp Set (tự động unique) và filter() (logic tùy chỉnh) để khử trùng mảng đơn giản, hiệu quả.

Cách 1: Set — Ngắn gọn, nhanh (Khuyên dùng)

Set chỉ lưu giá trị duy nhất. Chuyển mảng → Set → mảng.

<script>
  const dupNames = ['John', 'Ram', 'Rahim', 'Remo', 'Ram', 'Rahim'];
  const unique = [...new Set(dupNames)]; // Spread Set thành mảng

  document.write('Trước: ' + dupNames + '<br>');
  document.write('Sau Set: ' + unique);
</script>

Kết quả

Trước: John,Ram,Rahim,Remo,Ram,Rahim
Sau Set: John,Ram,Rahim,Remo

Cách 2: filter() + indexOf() — Logic thủ công

Giữ phần tử đầu tiên của mỗi giá trị (indexOf trả về index đầu tiên).

<script>
  const dupNames = ['John', 'Ram', 'Rahim', 'Remo', 'Ram', 'Rahim'];
  const unique = dupNames.filter((value, index, self) => 
    self.indexOf(value) === index
  );

  document.write('Trước: ' + dupNames + '<br>');
  document.write('Sau filter: ' + unique);
</script>

Kết quả

Trước: John,Ram,Rahim,Remo,Ram,Rahim
Sau filter: John,Ram,Rahim,Remo

Cách 3: filter() + Map/Object (Hiệu suất O(n) cho mảng lớn)

indexOf là O(n) → filter + indexOf = O(n²). Dùng Set hoặc Map để O(n).

function uniqueFast(arr) {
  const seen = new Set();
  return arr.filter(item => {
    if (seen.has(item)) return false;
    seen.add(item);
    return true;
  });
}
// Hoặc dùng Map cho key phức tạp (object)
function uniqueByKey(arr, keyFn) {
  const seen = new Map();
  return arr.filter(item => {
    const key = keyFn(item);
    if (seen.has(key)) return false;
    seen.set(key, true);
    return true;
  });
}

So sánh

Phương phápĐộ phức tạpGiữ thứ tựHỗ trợ objectGhi chú
[...new Set(arr)]O(n)CóChỉ primitiveNgắn gọn, chuẩn ES6
filter + indexOfO(n²)CóChỉ primitiveDễ hiểu, chậm mảng lớn
filter + Set/MapO(n)CóCó (với keyFn)Tùy biến, nhanh
reduce + ObjectO(n)CóCóLegacy pattern

Lưu ý

  • Set dùng SameValueZero equality: NaN === NaN (true), +0 === -0 (true).
  • Object/Array không so sánh được bằng giá trị — cần keyFn (JSON.stringify, id field, etc.).
  • Để unique object: arr.filter((v,i,a)=>a.findIndex(x=>x.id===v.id)===i) hoặc dùng Map theo id.