JavaScript Set — множина унікальних значень

Set (у перекладі — множина) зберігає лише унікальні значення: додати те саме двічі неможливо.

правити

Загальний опис

Найвідоміше застосування — прибрати дублікати з масиву. Те, що раніше писали циклом чи filter з indexOf, тепер робиться одним рядком: [...new Set(array)].

Але є й глибша причина брати Set: перевірка «чи є таке значення» через has() працює швидко незалежно від розміру, тоді як array.includes() перебирає масив із початку. На тисячах елементів різниця відчутна.

Унікальність визначається як у ===, з одним винятком: два NaN вважаються однаковими (у порівнянні NaN === NaN дає false, а Set їх зливає).

правити

Порада

[...new Set(array)] — найкоротший спосіб отримати масив без дублікатів. Порядок при цьому зберігається.

автор: NagarD правити

Нотатка

Унікальність об'єктів — за посиланням, а не за вмістом. Два однакові на вигляд {a: 1} — це два різні об'єкти, і Set збереже обидва.

автор: NagarD правити

+ додати пораду чи нотатку

Синтаксис

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

методи

властивості

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
Set	38+	13+	8+	25+	12+	11+

Підтримка: мобільні переглядачі

Переглядач
Set	38+	yes	yes	8+

Приклади

+ запропонувати свій приклад у пісочниці

const tags = ['css', 'js', 'css', 'html', 'js'];

const unique = [...new Set(tags)];
console.log(unique); // ['css', 'js', 'html']

const allowed = new Set(['css', 'js', 'html']);
// швидко навіть на тисячах елементів
console.log(allowed.has('css')); // true

allowed.add('svg');
allowed.delete('html');
console.log(allowed.size); // 3

// перетин двох множин
const a = new Set([1, 2, 3]);
const b = new Set([2, 3, 4]);
const common = [...a].filter(x => b.has(x)); // [2, 3]