Pochopení sad v JavaScriptu

autor:
Tweet
Share
Share
Pin

Sady představují novou funkčnost v JavaScriptu, zavedenou v ES6. Pojďme se na ně podívat blíže.

Co přesně sady jsou?

Jak s nimi pracovat v JavaScriptu?

A jaké metody nabízejí pro řešení konkrétních úkolů?

Odpovědi na všechny tyto otázky najdete v následujícím textu.

Sady v detailu

Jak už název napovídá, sada je datová struktura, která uchovává pouze unikátní prvky. Nepovoluje duplicitní hodnoty.

V JavaScriptu sady ukládají prvky v pořadí, ve kterém byly do sady vloženy. To znamená, že prvky v sadě jsou seřazeny. Sady mohou obsahovat jak primitivní datové typy, tak i objekty.

Podívejme se na syntaxi pro vytváření sad v JavaScriptu.

Doporučuji mít po ruce IDE, abyste si následující příklady mohli rovnou vyzkoušet.

const jmena = new Set(["Petr", "Karel", "Jan", "Josef", "Karel"]);
console.log(jmena);

const nahodneSlovo = new Set("Ahooooj");
console.log(nahodneSlovo);

const cisla = new Set([7, 7, 7, 3, 1, 1, 3, 6]);
console.log(cisla);

Vlastnosti a metody

Sady disponují řadou vlastností a metod, které nám usnadňují práci s nimi a řešení různých problémů. Práce s nimi je stejně jednoduchá jako jejich vytváření. Funkce metod je zřejmá už z jejich názvů. Podívejme se na ně postupně.

velikost

Vlastnost `size` vrací počet prvků, které se aktuálně nacházejí v sadě.

const jmena = new Set(["Petr", "Karel", "Jan", "Josef", "Karel"]);
console.log(`Velikost: ${jmena.size}`);

přidat

Metoda `add` se používá k přidání nového prvku do sady. Pokud se prvek, který se snažíme přidat, už v sadě nachází, nebude přidán znovu.

// prázdná sada
const jmena = new Set();

jmena.add("Petr");
jmena.add("Karel");
jmena.add("Jan");
jmena.add("Josef");
jmena.add("Karel");

console.log(jmena);

má

Metoda `has` přijímá jeden argument a vrací `true`, pokud se daný prvek v sadě nachází, jinak vrací `false`.

const jmena = new Set(["Petr", "Karel", "Jan", "Josef", "Karel"]);

console.log(jmena.has("Karel"));
console.log(jmena.has("Alena"));

vymazat

Jak už název napovídá, metoda `delete` přijímá jeden argument a smaže daný prvek ze sady. Pokud se prvek v sadě nenachází, nevyvolá to žádnou chybu.

const jmena = new Set(["Petr", "Karel", "Jan", "Josef", "Karel"]);

jmena.delete("Petr");

console.log(jmena);

záznamy

Metoda `entries` vrací iterátor, který obsahuje pole párů klíč-hodnota v pořadí, v jakém byly prvky vloženy. V případě sady je klíč totožný s hodnotou.

const jmena = new Set(["Petr", "Karel", "Jan", "Josef", "Karel"]);

const zaznamy = jmena.entries();

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

klíče

Metoda `keys` vrací iterátor prvků sady v pořadí, v jakém byly do sady vloženy.

const jmena = new Set(["Petr", "Karel", "Jan", "Josef", "Karel"]);

const klice = jmena.keys();

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

hodnoty

Metoda `values` vrací iterátor prvků sady v pořadí, v jakém byly do sady vloženy, podobně jako metoda `keys`.

const jmena = new Set(["Petr", "Karel", "Jan", "Josef", "Karel"]);

const hodnoty = jmena.values();

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

průhledná

Metoda `clear` odstraní všechny prvky ze sady.

const jmena = new Set(["Petr", "Karel", "Jan", "Josef", "Karel"]);

jmena.clear();

console.log(jmena);

pro každého

Metoda `forEach` se používá k iteraci sady a postupnému získávání všech jejích prvků.

const jmena = new Set(["Petr", "Karel", "Jan", "Josef", "Karel"]);

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

Příklad použití

Podívejme se na jednoduchý praktický příklad použití sady. Úkolem je odstranit duplicitní hodnoty z daného pole. K vyřešení tohoto problému můžeme využít vlastností sady.

Podívejme se na postup řešení:

  • Inicializujeme pole s fiktivními daty.
  • Inicializujeme prázdnou sadu.
  • Projdeme prvky pole.
    • Každý prvek přidáme do sady.
    • Duplicitní prvky budou automaticky odstraněny.
  • Inicializujeme prázdné pole.
  • Projdeme sadu a každý prvek přidáme do nového pole.
  • Vytiskneme nové pole.

Zkuste si tento příklad vyřešit sami. Pokud se vám to nedaří, podívejte se na řešení níže.

const arr = ["Petr", "Karel", "Jan", "Josef", "Karel"];

const temp = new Set();

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

const newArr = [];

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

console.log(newArr);

Závěr

Nyní máte všechny potřebné znalosti pro práci se sadami v JavaScriptu. Můžete je s úspěchem použít ve vašich projektech. Neostýchejte se a vyzkoušejte si jejich možnosti v praxi.

Ať se vám při kódování daří! 👨‍💻