JS6
Коллекция Set

Коллекция Set в JavaScript

Set — это встроенная коллекция JavaScript для хранения только уникальных значений. Она помогает удобно удалять дубликаты, быстро проверять наличие элемента и работать с наборами данных без повторов.

Коллекция Set в JavaScript

Коллекция Set — это встроенный объект JavaScript для хранения уникальных значений. Ее удобно использовать там, где важно исключить дубликаты и быстро проверять, есть ли элемент в наборе. В отличие от массива, где одно и то же значение может встречаться сколько угодно раз, Set сохраняет только уникальные элементы. Это делает коллекцию особенно полезной для задач фильтрации, подсчета уникальных значений, хранения списка посещенных элементов и многих других сценариев.

Коллекция Set в JavaScript
Коллекция Set в JavaScript

Понимание Set помогает писать более выразительный и эффективный код. Когда требуется работать именно с множеством значений без повторов, эта структура часто оказывается удобнее обычного массива. При этом Set остается простой в использовании: коллекция поддерживает перебор, методы добавления и удаления, а также проверку наличия элементов.

Что такое Set и зачем он нужен

Set можно представить как упорядоченное множество уникальных значений. Если попытаться добавить одно и то же значение несколько раз, в коллекции оно все равно останется в единственном экземпляре. Это ключевое отличие от массива. В массиве дубликаты допустимы, а в Set — нет.

Такая особенность помогает решать несколько типичных задач:

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

Коллекция Set особенно полезна, когда важно не только содержимое, но и уникальность каждого элемента. Если задача сводится к “есть или нет”, Set часто выглядит естественнее массива.

Создание коллекции Set

Создать Set можно с помощью конструктора. Внутрь можно передать массив или любой другой итерируемый объект. При этом повторяющиеся значения будут автоматически отброшены.

Пустой Set

const items = new Set();

Так создается пустая коллекция, в которую элементы можно добавлять позже.

Создание из массива

const uniqueNumbers = new Set([1, 2, 2, 3, 4, 4, 5]);

В результате в коллекции останутся значения 1, 2, 3, 4, 5. Повторы будут проигнорированы.

Создание из строк и других итерируемых объектов

const letters = new Set("banana");

Строка тоже итерируема, поэтому в набор попадут отдельные символы. В данном случае итоговая коллекция будет содержать b, a, n.

Основные свойства и методы Set

Коллекция Set поддерживает несколько стандартных свойств и методов, которые покрывают основные операции: добавление, удаление, проверку наличия и перебор.

Свойство / метод Назначение Пример использования
size Возвращает количество элементов set.size
add(value) Добавляет значение в коллекцию set.add(10)
delete(value) Удаляет значение set.delete(10)
has(value) Проверяет наличие значения set.has(10)
clear() Очищает коллекцию set.clear()
forEach() Перебирает элементы set.forEach(...)

Добавление элементов

const set = new Set();

set.add(1);
set.add(2);
set.add(2);
set.add(3);

После выполнения этого кода в коллекции будут только 1, 2 и 3. Повторное добавление 2 не изменит набор.

Проверка наличия значения

const colors = new Set(["red", "green", "blue"]);

console.log(colors.has("green")); // true
console.log(colors.has("black")); // false

Метод has() особенно важен, поскольку проверка наличия в Set — одна из самых частых операций. Именно из-за нее коллекцию нередко выбирают вместо массива.

Удаление элементов

const set = new Set([1, 2, 3]);

set.delete(2);

После удаления значение 2 исчезнет из набора. Если элемента не было, метод просто вернет false и не вызовет ошибки.

Очистка всей коллекции

const set = new Set([1, 2, 3]);

set.clear();

Метод clear() полностью опустошает коллекцию.

Как работает уникальность значений

Уникальность в Set основана на строгом сравнении значений. Это значит, что некоторые значения, которые выглядят похожими, все же могут считаться разными. Например, строка "1" и число 1 — это разные элементы.

Примеры поведения

const set = new Set();

set.add(1);
set.add("1");
set.add(true);
set.add(true);

В результате в наборе будет три значения: число 1, строка "1" и логическое true. Второе добавление true будет проигнорировано.

Особый интерес представляют объекты и массивы. Для Set важна не только форма данных, но и их ссылка в памяти. Два одинаково выглядящих объекта будут считаться разными элементами, если это разные экземпляры.

const a = { id: 1 };
const b = { id: 1 };

const set = new Set([a, b]);

Здесь в коллекции окажутся оба объекта, потому что это разные ссылки, несмотря на одинаковое содержимое.

Порядок элементов в Set

Коллекция Set сохраняет порядок вставки. Это означает, что элементы будут перебраны в том же порядке, в котором были добавлены. Такое поведение удобно, когда важна не только уникальность, но и последовательность.

Например, если в набор добавить значения 5, 1, 9, то при переборе они будут идти именно в этом порядке. Удаление и повторное добавление элемента тоже влияет на порядок: если значение убрать, а потом снова добавить, оно окажется в конце последовательности.

Перебор Set

Коллекцию Set можно перебирать разными способами. Поскольку она является итерируемой, часто используются циклы for...of, метод forEach() и преобразование в массив.

Перебор через for...of

const set = new Set(["a", "b", "c"]);

for (const value of set) {
  console.log(value);
}

Это один из самых простых и читаемых способов пройтись по всем элементам.

Перебор через forEach()

const set = new Set([10, 20, 30]);

set.forEach((value) => {
  console.log(value);
});

Метод forEach() удобен, когда нужно выполнить одно и то же действие для каждого значения.

Преобразование в массив

const set = new Set([1, 2, 3]);

const array = [...set];

Иногда коллекцию необходимо вернуть к массиву, например, для сортировки, объединения с другими массивами или использования методов массива.

Удаление дубликатов из массива с помощью Set

Один из самых популярных приемов — удаление повторов из массива. Для этого массив преобразуют в Set, а затем обратно в массив.

const values = [1, 2, 2, 3, 4, 4, 4, 5];

const uniqueValues = [...new Set(values)];

Результатом будет массив [1, 2, 3, 4, 5].

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

Когда этот прием особенно полезен

  • очистка списка пользовательских вводов;
  • обработка тегов, категорий, ключевых слов;
  • фильтрация повторяющихся чисел;
  • подготовка списка идентификаторов перед анализом.

Сравнение Set и массива

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

Критерий Массив Set
Дубликаты Допустимы Не допускаются
Доступ по индексу Есть Нет
Проверка наличия Обычно через includes() Через has()
Порядок вставки Сохраняется Сохраняется
Уникальность Нужно контролировать вручную Поддерживается автоматически

Если нужна нумерация элементов и работа как с упорядоченным списком, массив остается естественным выбором. Если требуется только множество уникальных значений, Set обычно оказывается удобнее.

Типичные сценарии использования Set

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

Подсчет уникальных значений

const numbers = [1, 2, 2, 3, 3, 3, 4];

const uniqueCount = new Set(numbers).size;

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

Хранение посещенных элементов

При обходе структуры данных или выполнении поиска Set удобно использовать для хранения уже посещенных узлов. Это помогает избежать повторной обработки одних и тех же объектов и предотвращает зацикливание в некоторых алгоритмах.

Отслеживание уникальных идентификаторов

Когда в список попадают идентификаторы записей, пользователей или событий, Set позволяет быстро понять, был ли элемент уже добавлен. Это особенно полезно в логике дедупликации.

Контроль повторных действий

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

Особенности работы с объектами и массивами в Set

При работе с примитивами Set ведет себя предсказуемо. Но с объектами нужно быть внимательнее. Две структуры с одинаковыми полями не считаются одним и тем же элементом, если это разные объекты.

const set = new Set();

set.add({ name: "Alex" });
set.add({ name: "Alex" });

Здесь в коллекции окажутся два элемента. Для Set это разные ссылки, даже если содержимое одинаковое.

Если требуется уникальность по определенному полю, обычно сначала извлекают ключи, а затем добавляют их в Set. Например, можно хранить набор id, а не целые объекты. Это позволяет сравнивать записи по бизнес-логике, а не по ссылке в памяти.

Полезные приемы с Set

Проверка пересечения наборов

Если нужно понять, есть ли общие элементы у двух коллекций, Set делает такую проверку удобной. Достаточно пройтись по одному набору и проверить элементы через has() во втором.

const first = new Set([1, 2, 3]);
const second = new Set([3, 4, 5]);

let hasCommon = false;

for (const value of first) {
  if (second.has(value)) {
    hasCommon = true;
    break;
  }
}

Фильтрация с сохранением уникальности

const input = ["apple", "banana", "apple", "orange", "banana"];
const result = [...new Set(input)];

Такой прием часто применяют для очистки пользовательских списков или нормализации данных перед сохранением.

Преобразование Set в массив с последующей обработкой

const set = new Set([5, 1, 4, 2]);

const sorted = [...set].sort((a, b) => a - b);

Поскольку у Set нет методов сортировки, для упорядочивания данные обычно сначала переводят в массив.

Ограничения и нюансы

Несмотря на удобство, Set не решает все задачи. У коллекции нет доступа по индексу, как у массива, поэтому нельзя просто обратиться к “третьему элементу”. Если нужен такой сценарий, сначала придется преобразовать коллекцию в массив.

Еще один важный нюанс связан с сериализацией. При передаче данных в формат Обычно перед сериализацией ее переводят в массив, а при необходимости восстанавливают обратно.

const set = new Set([1, 2, 3]);
const stringify([...set]);

Такой подход удобен, когда требуется передать уникальный список через

Также следует помнить, что Set не выполняет глубокое сравнение объектов. Если логика проекта требует считать равными объекты с одинаковыми свойствами, но разными ссылками, потребуется отдельный механизм сравнения.

Когда Set особенно уместен

Коллекция Set хорошо подходит для задач, где основная операция — это проверка принадлежности и обеспечение уникальности. Она особенно полезна, если данные поступают в произвольном порядке, а повторения нежелательны.

  • списки тегов и ключевых слов;
  • наборы id и кодов;
  • пометки обработанных элементов;
  • удаление повторов из пользовательского ввода;
  • алгоритмы обхода графов и деревьев;
  • сравнение множеств значений без повторов.

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

Заключение

Set — это простая и практичная коллекция JavaScript для хранения уникальных значений. Она помогает избавляться от дубликатов, быстро проверять наличие элементов и делать код чище в задачах, где повторения не нужны. Понимание особенностей Set, включая порядок вставки, поведение с объектами и способы перебора, позволяет использовать его осознанно и эффективно. В подходящих сценариях эта структура становится удобной альтернативой массиву и заметно упрощает работу с данными.

FAQ

Почему Set лучше подходит для удаления дублей, чем обычный массив?
Set автоматически хранит только уникальные значения, поэтому при добавлении повторов они просто игнорируются. Это избавляет от ручной проверки и упрощает код, особенно когда нужно быстро очистить список от повторяющихся элементов.

В массиве дубликаты допустимы по умолчанию, а значит, для их удаления обычно приходится использовать дополнительные операции: проход по списку, сравнение, фильтрацию. Set делает это сразу при создании или при добавлении элементов. Поэтому прием с преобразованием массива в Set часто оказывается короче, понятнее и менее подвержен ошибкам.

На практике это удобно для списков чисел, тегов, категорий, ключевых слов и идентификаторов. Если важно именно множество без повторов, Set обычно дает более естественную модель данных, чем массив.
Чем отличается строка "1" от числа 1 в Set?
Для Set важен тип значения, а не только его внешний вид. Поэтому строка "1" и число 1 считаются разными элементами и могут одновременно находиться в одной коллекции.

Это связано с тем, что уникальность в Set основана на строгом сравнении. Из-за этого логические, числовые и строковые значения с похожим написанием не смешиваются. Например, добавление true несколько раз не создаст дубликатов, но строка "true" была бы отдельным значением.

Такое поведение полезно, когда важно не перепутать данные разных типов. Но если значения приходят из внешнего источника, стоит заранее приводить их к нужному виду, иначе можно получить неожиданный набор уникальных элементов.
Почему два одинаковых объекта попадают в Set как разные элементы?
Для объектов и массивов Set сравнивает не содержимое, а ссылку в памяти. Поэтому два объекта с одинаковыми полями, например { id: 1 } и { id: 1 }, будут считаться разными, если это разные экземпляры.

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

На практике это означает, что прием с [...new Set(...)] хорошо работает для примитивов, но для объектов часто нужен предварительный способ выделить ключ уникальности. Иначе набор не уберет «одинаковые на вид» записи.
Как понять, сохранится ли порядок элементов после добавления и удаления?
Set сохраняет порядок вставки: элементы перебираются в том же порядке, в котором были добавлены. Это значит, что если вы сначала добавили 5, затем 1 и 9, то при обходе получите именно эту последовательность.

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

Поэтому Set удобен, когда нужны и уникальность, и предсказуемый порядок. Но если требуется сортировка по числу, алфавиту или дате, после преобразования в массив придется выполнить отдельную сортировку.
Когда лучше использовать has(), а не искать элемент в массиве?
Метод has() у Set предназначен именно для быстрой проверки наличия значения. Это одна из главных причин, почему Set часто выбирают вместо массива в задачах, где постоянно нужно отвечать на вопрос «есть элемент или нет».

В массиве похожую задачу обычно решают через includes(), но концептуально массив больше подходит для последовательности и доступа по индексу. Если же приоритет — уникальность и проверка присутствия, Set выглядит естественнее и чище по смыслу.

В реальных сценариях has() полезен для проверки посещенных элементов, уже обработанных тегов, повторяющихся идентификаторов и любых списков, где лишние дубликаты не нужны. Это делает код понятным и избавляет от повторной логики фильтрации.
Можно ли преобразовать Set обратно в массив и зачем это делать?
Да, Set легко преобразуется в массив, чаще всего через spread-оператор: [...set]. Это удобно, потому что Set хорош для хранения уникальных значений, а массив — для многих операций обработки данных.

После преобразования можно сортировать элементы, объединять их с другими массивами, применять методы массива или передавать в код, который ожидает именно массив. То есть Set часто выступает как промежуточная структура: сначала убирает повторы, а потом данные возвращаются в привычный формат.

Такой подход особенно полезен, когда сначала нужно очистить список, а затем продолжить работу с ним как с обычной последовательностью. Например, после удаления дублей можно отсортировать значения или подготовить их к выводу.
Что произойдет, если добавить одно и то же значение в Set несколько раз?
Повторное добавление одного и того же значения не увеличит размер коллекции и не создаст новый элемент. Set просто проигнорирует дубликат, потому что его основная особенность — хранить только уникальные значения.

Это поведение помогает избежать скрытых повторов и упрощает логику. Например, если вы многократно добавляете один и тот же тег, идентификатор или число, итоговый набор останется чистым. При этом метод add() можно вызывать сколько угодно раз — это безопасно и не приводит к ошибке.

Такой механизм особенно полезен в задачах накопления данных, когда заранее неизвестно, будут ли повторы. Set автоматически берет на себя контроль уникальности, поэтому код становится короче и надежнее.
Подходит ли Set для хранения списка посещенных элементов или категорий?
Да, это один из самых естественных сценариев для Set. Если нужно помнить, что элемент уже встречался, или хранить перечень категорий без повторов, Set делает такую задачу простой и прозрачной.

Для списка посещенных элементов важны две операции: быстро добавить новое значение и быстро проверить, было ли оно раньше. Именно эти действия Set поддерживает особенно удобно через add() и has(). В результате логика получается компактной и понятной без лишних проверок на дубли.

То же относится к категориям, тегам, идентификаторам и любым спискам, где повтор нежелателен по смыслу. Если порядок вставки тоже важен, Set дополнительно сохраняет его, что делает структуру еще практичнее для подобных задач.

Похожие страницы