Заданная структура данных в Javascript

Узнайте, как и когда использовать Set в JavaScript.

Объект Set позволяет вам создать коллекцию из unique values (каждое значение может встречаться только один раз).

Set может содержать любой тип значения (примитивы или ссылку на объект).

Set хранит элементы в insertion order.

Set не содержит ключей 🔑, как объект Карта.

Уникальность элементов Set проверяется с помощью алгоритма SameValueZero. Этот алгоритм похож на === (строгое равенство), за исключением одного случая, когда NaN === NaN оценивается как истина, так что несколько NaN не вставляются в Set.

Создание Set

Синтаксис: new Set([iterable]) → возвращает объект Set.

var set1 = new Set([1, 2, 1, 3, 4, 5]);
set1; // Set(5) {1, 2, 3, 4, 5} ; duplicate values are removed.
Creating an empty set
var set2 = new Set();

Свойства

size → Возвращает количество элементов в Set

var number = new Set([1,2,3,4,5])
number.size ; 

Методы

add()

Метод add() добавляет переданный элемент в конец объекта Set и возвращает объект Set .

var fruits = new Set(['🍇', '🍉', '🍊', '🍈' ]);
fruits.add('🍋');
fruits; // Set(5) {'🍇', '🍉', '🍊', '🍈', '🍋'};

Когда мы пытаемся добавить повторяющиеся значения, они не вставляются.

fruits.add('🍊'); // already present in the set
fruits; // Set(5) {'🍇', '🍉', '🍊', '🍈', '🍋'};

Метод add может быть связан с цепочкой

fruits
      .add('🍌')
      .add('🍓')
      .add('🍎');
fruits; // Set(8) {"🍇", "🍉", "🍊", "🍈", "🍋", …}

Добавление объектов в Set

var set = new Set();
set.add({i : 10});
set.add({i : 10});
set; //Set(2) {{…}, {…}}
// Even-though objects look same, each object has different reference, so they are not ===
// An object reference means that it compares the memory address of the object and not the actual key/value pairs contained in the object.
--------------------------------------------------------------------
var obj = {i :100};
set.add(obj);
set.add(obj);
// Now the obj points to same object reference so it is not inserted
--------------------------------------------------------------------
obj.i =1000;
// the value in the set is changed because we are storing the address.

has()

Метод has() возвращает true, если элемент с указанным значением существует в объекте Set, и false, если значение отсутствует в Set.

Синтаксис: has(valueToBeChecked) → возвращает истину или ложь.

var fruits = new Set(['🍇', '🍉', '🍊', '🍈' ]);
fruits.has('🍇'); //true
fruits.has('🍌'); //false

has метод с объектом

var set = new Set();
var obj = {i :100};
set.add(obj);
set.has(obj); // true
set.has({i : 100}); //false, because they are different object  reference.

values()

Метод values() возвращает новый объект Iterator, который содержит значения для каждого элемента в объекте Set в порядке вставки.

var fruits = new Set(['🍇', '🍉', '🍊', '🍈' ]);
fruits.values();  // SetIterator {"🍇", "🍉", "🍊", "🍈", "🍋", …}
--------------------------------------------------------------------
//use destructor to print only the values
console.log(...fruits.values())
or 
var fruitsArray = ([...fruits.values]);

entries()

Метод entries() возвращает новый объект Iterator, содержащий массив [value, value] в порядке вставки.

В Set нет ключа, поэтому он возвращается в формате [value, value].

var fruits = new Set(['🍇', '🍉']);
fruits.entries();  SetIterator {"🍇" => "🍇", "🍉" => "🍉"}
--------------------------------------------------------------------
// you can use for...of 
for(var [key ,value] of fruits.entries()) {
   console.log(key, value); 
}

delete()

Метод delete() удаляет указанный элемент из объекта Set.

Синтаксис: delete(valueToBeDeleted)

Возвращает true, если элемент в Set удален, в противном случае возвращает false.

var fruits = new Set(['🍇', '🍉']);
fruits.delete('🍇'); //true
fruits; //Set(1) {"🍉"}
fruits.delete('🍌'); false.

clear()

Метод clear() очищает объектSet.

var fruits = new Set(['🍇', '🍉']);
fruits.size; // 2
fruits.clear(); 
fruits.size; // 0

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

let print= function(key , value, set) {
   console.log(value);
}
var fruits = new Set(['🍇', '🍉']);
fruits.forEach(print)
//output
🍇
🍉

Секреты и уловки

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

var text = 'LEARN';
var mySet = new Set(text);  
//Set(5) {"L", "E", "A", "R", "N"}

2. Удаление повторяющихся элементов из массива

var names= [ 'John', 'Brandi', 'Tony', 'John'];
var uniqueNames = [...new Set(names)]
uniqueNames = [ 'John', 'Brandi', 'Tony'];

3. Чем отличаются массив и набор

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

• Значение NaN не может быть найдено с indexOf в массиве.
• Set объекты позволяют удалять элементы по их значению. С массивом вам нужно будет выполнить стыковку на основе индекса элемента.

Подробнее о карте 🗺 можно прочитать здесь.

Если вы найдете этот полезный сюрприз, то я здесь.

Поделитесь, если вы счастливы 😃 😆 🙂.

Подпишитесь на Javascript Jeep🚙, если чувствуете себя достойным.