Home > Web Front-end > JS Tutorial > How to Efficiently Remove Duplicate Values from a JavaScript Array?

How to Efficiently Remove Duplicate Values from a JavaScript Array?

Mary-Kate Olsen
Release: 2024-12-20 13:00:26
Original
731 people have browsed it

How to Efficiently Remove Duplicate Values from a JavaScript Array?

Remove duplicate values from JS array

Removing duplicate values from a JavaScript array can be a common task, especially when working with data that may contain redundant entries. There are several approaches to achieve this effectively, depending on the nature of your data and performance considerations.

Using Set constructor and spread syntax

This method leverages the built-in Set constructor and the spread syntax to create a new array that contains only unique values from the original array:

const uniq = [...new Set(array)];
Copy after login

"Smart" but naïve way

This approach uses the filter() method to iterate over the array and check if the first occurrence of each element matches its current position within the array. Elements with mismatched positions are considered duplicates:

const uniqueArray = a.filter((item, pos) => a.indexOf(item) === pos);
Copy after login

Hashtables to the rescue

Hashtables provide an efficient way to detect duplicate elements by using key-value pairs. In this approach, each element is added to a hashtable, and the presence of an element is checked instantly:

function uniq(a) {
  const seen = {};
  return a.filter((item) => {
    return seen.hasOwnProperty(item) ? false : (seen[item] = true);
  });
}
Copy after login

The best from two worlds

To combine the benefits of the previous two approaches, this solution utilizes hashtables for primitive values and linear search for objects:

function uniq(a) {
  const prims = { boolean: {}, number: {}, string: {} }, objs = [];

  return a.filter((item) => {
    const type = typeof item;
    if (type in prims) return prims[type].hasOwnProperty(item) ? false : (prims[type][item] = true);
    else return objs.indexOf(item) >= 0 ? false : objs.push(item);
  });
}
Copy after login

Sort | uniq

Sorting the array before removing duplicates can simplify the process:

function uniq(a) {
  return a.sort().filter((item, pos, ary) => !pos || item != ary[pos - 1]);
}
Copy after login

Unique by...

When you need to remove duplicates based on a specific criteria, such as a property of an object, you can provide a callback function to the uniqBy() method:

function uniqBy(a, key) {
  const seen = {};
  return a.filter((item) => {
    const k = key(item);
    return seen.hasOwnProperty(k) ? false : (seen[k] = true);
  });
}
Copy after login

First or last?

If you want to keep only the first or last occurrence of duplicate objects, you can use the Set or Map data structures:

function uniqByKeepFirst(a, key) {
  const seen = new Set();
  return a.filter((item) => {
    const k = key(item);
    return seen.has(k) ? false : seen.add(k);
  });
}

function uniqByKeepLast(a, key) {
  return [...new Map(a.map((x) => [key(x), x])).values()];
}
Copy after login

The above is the detailed content of How to Efficiently Remove Duplicate Values from a JavaScript Array?. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template