Zrozumienie zestawów w JavaScript

Zestawy to nowy dodatek do JavaScript w ES6. Dowiedzmy się o tym.

Jakie są zestawy?

Jak ich używać w JavaScript?

A jakie metody zapewnia rozwiązywanie problemów?

Znajdźmy odpowiedzi na wszystkie pytania w tym samouczku.

Spis treści:

Zestawy

Jak sama nazwa wskazuje, zestaw to zbiór unikalnych elementów. Nie przechowuje powtarzających się wartości.

Zestawy w JavaScript będą przechowywać elementy w zamówieniu reklamowym. Są więc uporządkowane w JavaScript. I będzie przechowywać prymitywne typy danych lub obiekty.

Zobaczmy składnię zestawów w JavaScript.

Mam nadzieję, że masz IDE, aby ćwiczyć następujące rzeczy.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
console.log(names);

const randomWord = new Set("Hiiiiiii");
console.log(randomWord);

const numbers = new Set([5, 5, 5, 2, 1, 1, 2, 3]);
console.log(numbers);

Właściwości i metody

Zestawy mają różne właściwości i metody, które pomagają nam pracować z nimi w celu rozwiązania różnych problemów. Właściwości i metody są tak proste, jak ich utworzenie. Możesz łatwo uzyskać funkcjonalność metod wraz z ich nazwami. Zobaczmy je jeden po drugim.

rozmiar

Właściwość size zwraca liczbę elementów obecnych w zestawie.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);
console.log(`Size: ${names.size}`);

Dodaj

Metoda add służy do dodania nowego elementu do zestawu. Jeśli nowy element jest już obecny w zestawie, to go nie doda.

// empty set
const names = new Set();

names.add("John");
names.add("Harry");
names.add("Wick");
names.add("Jack");
names.add("Harry");

console.log(names);

ma

Metoda ma jeden argument i zwraca true, jeśli element jest obecny w zestawie, w przeciwnym razie zwraca false.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

console.log(names.has("Harry"));
console.log(names.has("Alley"));

kasować

Jak można się spodziewać, metoda delete przyjmuje argument i usuwa go ze zbioru. Nie wyrzuca żadnego błędu, nawet jeśli podany argument nie występuje w zestawie.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

names.delete("John");

console.log(names);

wpisy

Wpisy metody zwracają iterator zawierający tablice par klucz-wartość w kolejności wstawiania. Tutaj klucz i wartość są takie same.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

const entries = names.entries();

console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);
console.log(entries.next().value);

Klucze

Klawisze metody zwracają iterator zestawu elementów w zamówieniu reklamowym.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

const keys = names.keys();

console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);
console.log(keys.next().value);

wartości

Wartości metody zwracają iterator zestawu elementów w kolejności wstawiania, podobnie jak klucze metody.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

const values = names.values();

console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);
console.log(values.next().value);

jasne

Metoda clear usuwa wszystkie elementy ze zbioru.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

names.clear();

console.log(names);

dla każdego

Metoda forEach służy do iteracji po zbiorze i pobierania z niego wszystkich elementów jeden po drugim.

const names = new Set(["John", "Harry", "Wick", "Jack", "Harry"]);

names.forEach((element) => {
   console.log(element);
});

Różnorodny

Zobaczmy prostą aplikację zestawów za pomocą programu. Biorąc pod uwagę tablicę, usuń z niej wszystkie zduplikowane wartości. Aby rozwiązać problem, możemy skorzystać z właściwości set.

Zobaczmy, jak go rozwiązać.

Zainicjuj tablicę z fikcyjnymi danymi.
Zainicjuj pusty zestaw.
Iteruj po tablicy elementów.
- Dodaj każdy element do zestawu.
- Automatycznie usunie zduplikowane elementy.
Zainicjuj pustą tablicę.
Iteruj po zestawie i dodaj każdy element do nowej tablicy.
Wydrukuj nową tablicę.

Mam nadzieję, że sam to rozwiążesz. Jeśli masz trudności z kodowaniem, spójrz na poniższe rozwiązanie.

const arr = ["John", "Harry", "Wick", "Jack", "Harry"];

const temp = new Set();

arr.forEach((element) => {
   temp.add(element);
});

const newArr = [];

temp.forEach((element) => {
   newArr.push(element);
});

console.log(newArr);

Wniosek

Teraz masz całą wiedzę potrzebną do pracy z zestawami w JavaScript. Możesz ich użyć w następnym projekcie. Śmiało i wykorzystaj każdą jego część.

Miłego kodowania 👨‍💻