Sady JavaScriptu

Obsah

    Zobrazit obsah

Sada JavaScriptu je kolekce jedinečných hodnot.

Každá hodnota se může v sadě vyskytnout pouze jednou.

Základní metody sady

new Set()

Vytvoří novou sadu

add()

Přidá nový prvek do sady

delete()

Odebere prvek ze sady

has()

Vrátí hodnotu true, pokud v sadě existuje hodnota

forEach()

Vyvolá zpětné volání pro každý prvek v sadě

values()

Vrátí iterátor se všemi hodnotami v sadě

size

Vrátí počet prvků v sadě

Jak vytvořit sadu

Sadu JavaScriptu můžete vytvořit takto:

  • Předání pole do nové Set()

  • Vytvořte novou sadu a pomocí add() přidejte hodnoty

  • Vytvořte novou sadu a pomocí add() přidejte proměnné

Metoda new Set()

Předejte pole konstruktoru new Set():

Příklad

// Create a Set
const letters = new Set(["a","b","c"]);

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>Create a Set from an Array:</p>

<p id="demo"></p>

<script>
// Create a Set
const letters = new Set(["a","b","c"]);

// Display set.size
document.getElementById("demo").innerHTML = letters.size;
</script>

</body>
</html>

Vytvořte sadu a přidejte hodnoty:

Příklad

// Create a Set
const letters = new Set();

// Add Values to the Set
letters.add("a");
letters.add("b");
letters.add("c");

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>Add values to a Set:</p>

<p id="demo"></p>

<script>
// Create a Set
const letters = new Set();

// Add Values to the Set
letters.add("a");
letters.add("b");
letters.add("c");

// Display set.size
document.getElementById("demo").innerHTML = letters.size;
</script>

</body>
</html>

Vytvořte sadu a přidejte proměnné:

Příklad

// Create a Set
const letters = new Set();

// Create Variables
const a = "a";
const b = "b";
const c = "c";

// Add Variables to the Set
letters.add(a);
letters.add(b);
letters.add(c);

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>Add variables to a Set:</p>

<p id="demo"></p>

<script>
// Create a Set
const letters = new Set();

// Create Variables
const a = "a";
const b = "b";
const c = "c";

// Add the Variables to the Set
letters.add(a);
letters.add(b);
letters.add(c);

// Display set.size
document.getElementById("demo").innerHTML = letters.size;
</script>

</body>
</html>

Metoda add()

Příklad

letters.add("d");
letters.add("e");

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>Adding new elements to a Set:</p>

<p id="demo"></p>

<script>
// Create a new Set
const letters = new Set(["a","b","c"]);

// Add a new Element
letters.add("d");
letters.add("e");

// Display set.size
document.getElementById("demo").innerHTML = letters.size;
</script>

</body>
</html>

Pokud přidáte stejné prvky, uloží se pouze první:

Příklad

letters.add("a");
letters.add("b");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>Adding equal elements to a Set:</p>

<p id="demo"></p>

<script>
// Create a Set
const letters = new Set();

// Add values to the Set
letters.add("a");
letters.add("b");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");

// Display set.size
document.getElementById("demo").innerHTML = letters.size;
</script>

</body>
</html>

Metoda forEach()

Metoda forEach() vyvolá (volá) funkci pro každý prvek Set:

Příklad

// Create a Set
const letters = new Set(["a","b","c"]);

// List all Elements
let text = "";
letters.forEach (function(value) {
  text += value;
})

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>forEach() calls a function for each element:</p>

<p id="demo"></p>

<script>
// Create a Set
const letters = new Set(["a","b","c"]);

// List all Elements
let text = "";
letters.forEach (function(value) {
  text += value + "<br>";
})

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Metoda values()

Metoda values() vrací nový objekt iterátoru obsahující všechny hodnoty v sadě:

Příklad

letters.values()   // Returns [object Set Iterator]

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>Set.values() returns a Set Iterator:</p>

<p id="demo"></p>

<script>
// Create a Set
const letters = new Set(["a","b","c"]);

// Display set.size
document.getElementById("demo").innerHTML = letters.values();
</script>

</body>
</html>

Nyní můžete použít objekt Iterator pro přístup k prvkům:

Příklad

// List all Elements
let text = "";
for (const x of letters.values()) {
  text += x;
}

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>Iterating Set values:</p>

<p id="demo"></p>

<script>
// Create a Set
const letters = new Set(["a","b","c"]);

// List all Elements
let text = "";
for (const x of letters.values()) {
  text += x + "<br>";
}

document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>