Как отобрать элементы с уникальными значениями в массиве?
У нас есть массив из чисел:
var massiv = [1, 2, 3, 3, 4, 4, 4, 5, 6, 7, 10, 10, 10, 40, 65, 83, 83, 83, 109, 109, 432, 456]
Этот массив отсортирован по возрастанию элементов, чтобы было легче его воспринимать и видеть дубликаты значений.
Мы видим, что значения элементов повторяются. Нас интересует только единичные экземпляры одного значения. То есть мы хотим удалить дубли, оставив оригиналы. Мы хотим сократить длину массива и подготовить массив для дальнейшей обработки. Как их получить?
Видео инструкция
В этом видео приводится пример создания набора уникальных элементов массива JavaScript. Ввод команд осуществляется в консоль браузера Google Chrome. Результат виден сразу.
Решение задачи
У «Глобального Объекта» JavaScript есть свойства-конструкторы Array и Set — массивы и наборы. Каждое из этих свойств является конструктором для создания экземпляров своего вида. Так, конструктор Array() создаёт экземпляры массивов, а конструктор Set() создаёт экземпляры наборов.
Для начала мы передадим наш массив в конструктор Набора. Новый набор мы можем создать только при помощи оператора new.
new Set(massiv)
В ответ получаем объект Набора. «Внутренний Слот» (Internal Slot) — [[Entries]]. Этот слот содержит массив в котором произошли нужные нам преобразования.
Теперь нам нужно достать из этого Набора (Set) массив с уникальными элементами. Для этого будем использовать свойство from() конструктора Array.
Array.from(new Set(massiv))
В ответ нам приходит массив с уникальными значениями элементов
Итог
Мы применили два конструктора и получили уникальные значения элементов в массиве. Мы избавились от дублей, тем самым укоротили длину массива. Это очень полезное решение, когда дело касается обхода каждого элемента массива (например, обхода URL адресов из массива).
Информационные ссылки
Стандарт ECMAScript — Массивы — https://tc39.es/ecma262/#sec-array-objects
Стандарт ECMAScript — Наборы — https://tc39.es/ecma262/#sec-set-objects
