Как удалить дубликаты в массиве в JS

От /
Photo by Nikita Godunov on Unsplash

Необходимость удалить дубликаты в массиве в JS возникает не так уж редко. Например — чтобы удалить данные, когда кто-то дважды заполнил форму. На самом деле таких вариантов может быть сколько угодно. В этой статье мы рассмотрим три способа удаления дубликатов.

1. Использование Set

При помощи Set() создается объект из уникальных значений. Неявное использование этого объекта позволяет удалить дубликаты из массива.

Мы можем воспользоваться этим методом, только нужно будет еще преобразовать Set в новый массив. Выглядит это так:

let chars = ['A', 'B', 'A', 'C', 'B'];
let uniqueChars = [...new Set(chars)];

console.log(uniqueChars);

Результат:

['A', 'B', 'C']

2. Использование методов indexOf() и filter()

Метод indexOf() возвращает индекс первого вхождения элемента в массиве:

let chars = ['A', 'B', 'A', 'C', 'B'];
chars.indexOf('B');

Результат:

1

Дубликатом будет считаться элемент с индексом, отличным от значения indexOf():

let chars = ['A', 'B', 'A', 'C', 'B'];

chars.forEach((element, index) => {
    console.log(`${element} - ${index} - ${chars.indexOf(element)}`);
});

Результат:

A - 0 - 0
B - 1 - 1
A - 2 - 0
C - 3 - 3
B - 4 - 1

Для удаления дубликатов используется метод filter(). Он создает новый массив из элементов, соответствующих заданным условиям. В нашем случае он включает в массив только те элементы, индексы которых совпадают с их значениями indexOf().

let chars = ['A', 'B', 'A', 'C', 'B'];

let uniqueChars = chars.filter((element, index) => {
    return chars.indexOf(element) === index;
});

console.log(uniqueChars);

Результат:

['A', 'B', 'C']

Если по какой-то причине нам нужны сами дубликаты, мы можем модифицировать нашу функцию, слегка изменив наше правило:

let chars = ['A', 'B', 'A', 'C', 'B'];

let dupChars = chars.filter((element, index) => {
    return chars.indexOf(element) !== index;
});

console.log(dupChars);

Результат:

['A', 'B']

3. Использование методов includes() и forEach()

Функция include() возвращает true, если элемент есть в массиве, и false — если такого элемента в массиве нет.

В следующем примере мы перебираем элементы массива и добавляем в новый массив только те, которых там пока нет.

let chars = ['A', 'B', 'A', 'C', 'B'];

let uniqueChars = [];
chars.forEach((element) => {
    if (!uniqueChars.includes(element)) {
        uniqueChars.push(element);
    }
});

console.log(uniqueChars);

Результат:

['A', 'B', 'C']

В общем, удалить дубликаты в массиве в JS можно разными способами, выбирая наиболее подходящий для каждого конкретного случая.

Перевод статьи «3 ways to remove duplicates in an Array in Javascript».

От редакции Techrocks. Также рекомендуем статью «Как удалить элемент из массива в JavaScript».

[customscript]techrocks_custom_after_post_html[/customscript]

[customscript]techrocks_custom_script[/customscript]

Прокрутить вверх