Как в Javascript получить массив уникальных значений (unique array)?

Как в Javascript получить массив уникальных значений (unique array)?


15.08.2018
/
oberset

Каждый разработчик рано или поздно сталкивался с необходимостью получения массива уникальных значений (unique array). У объекта Array в Javascript отсутствует стандартный метод, который бы вернул уникальный массив, поэтому приходиться искать обходные пути. К счастью, подобная задача имеет несколько стандартных решений и отфильтровать массив, оставив в нем только уникальные неповторяющиеся значения не составит труда. Рассмотрим три наиболее простых варианта.

Функция uniq из библиотеки Lodash

Если есть возможность подключить библиотеку Lodash и нет желания самому реализовывать фильтрацию массива, можно воспользоваться библиотечной функцией uniq. Эта функция принимает исходный массив в качестве аргумента и возвращает отфильтрованный массив с уникальными значениями. Пример использования:

// Lodash подключена и доступна через переменную _

_.uniq(['one', two', 'one', 'three']);
// ['one', two', 'three']

Кроме uniq в Lodash множество полезных функций, которые вам обязательно пригодятся!

Использование объекта Set

В ES6 для решения подобной задачи можно применить объект Set, который хранит набор уникальных значений. Нужно создать объект Set, передав ему в качестве значений элементы исходного массива, а после этого преобразовать значения объекта обратно в массив. Вот пример, как это можно сделать:

const uniqueArray = (array) => Array.from(new Set(array));
uniqueArray([1,2,3,1,3,4]);
// [ 1, 2, 3, 4 ]

В этом примере мы также использовали статический метод from класса Array, который умеет преобразовывать массивоподобный(array-like) объект или итератор в массив. Этот вариант решения занимает 1 строчку кода.

Собственная реализация функции unique

Этот вариант подойдет для тех, кто не ищет легких путей. Алгоритм решения задачи следующий: нужно для каждого элемента массива проверить, нет ли в массиве другого элемента, значение которого равно текущему. Используя метод filter можно значительно сократить код:

const uniqueArray = (array) => array.filter((item, i, passedArray) => passedArray.indexOf(item) === i);

uniqueArray([1,2,2,2,2,1,2,1,2]);
// [ 1, 2 ]

Есть также масса более громоздких и примитивных способов реализации uniqueArray через циклы, но останавливаться на них не имеет смысла. Всегда лучше выбрать более короткое и простое решение.

Поиск и проверка значений в массиве на Javascript

Примеры поиска значений в массиве с помощью методов find, findIndex, includes, every и других.

Примеры использования Array reduce в Javascript

Метод reduce(callback, initialValue) возвращает результат функции callback, которая применяется к каждому элементу массива.

Поиск одинаковых элементов в массиве на Javascript

Для решения задачи можно написать обход массива в цикле, но у объекта Array уже есть несколько удобных методов, которые нам помогут.