JavaScript sæt

Indholdsfortegnelse

    Vis indholdsfortegnelse

Et JavaScript-sæt er en samling af unikke værdier.

Hver værdi kan kun forekomme én gang i et sæt.

Et sæt kan indeholde enhver værdi af enhver datatype.

Indstil metoder

new Set()

Opretter et nyt sæt

add()

Tilføjer et nyt element til sættet

delete()

Fjerner et element fra et sæt

has()

Returnerer sand, hvis der findes en værdi

clear()

Fjerner alle elementer fra et sæt

forEach()

Kalder et tilbagekald for hvert element

values()

Returnerer en iterator med alle værdierne i et sæt

keys()

Samme som værdier()

entries()

Returnerer en iterator med [værdi,værdi]-parrene fra et sæt

size

Returnerer talelementerne i et sæt

Sådan opretter du et sæt

Du kan oprette et JavaScript-sæt ved at:

  • Sender et array til new Set()

  • Opret et nyt sæt og brug add() til at tilføje værdier

  • Opret et nyt sæt og brug add() til at tilføje variabler

Den nye Set() metode

Send et array til new Set()-konstruktøren:

Eksempel

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

Prøv det selv →

<!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>

Opret et sæt og tilføj bogstavelige værdier:

Eksempel

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

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

Prøv det selv →

<!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>

Opret et sæt og tilføj variabler:

Eksempel

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

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

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

Prøv det selv →

<!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>

Metoden add()

Eksempel

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

Prøv det selv →

<!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>

Hvis du tilføjer lige store elementer, vil kun de første blive gemt:

Eksempel

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

Prøv det selv →

<!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>

Metoden forEach()

Metoden forEach() aktiverer en funktion for hvert sæt-element:

Eksempel

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

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

Prøv det selv →

<!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>

Metoden values()

Metoden values() returnerer et Iterator-objekt, der indeholder alle værdierne i et sæt:

Eksempel

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

Prøv det selv →

<!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>

Nu kan du bruge Iterator-objektet til at få adgang til elementerne:

Eksempel

// Create an Iterator
const myIterator = letters.values();

// List all Values
let text = "";
for (const entry of myIterator) {
  text += entry;
}

Prøv det selv →

<!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>

Metoden keys()

Et sæt har ingen nøgler.

keys() returnerer det samme som værdier().

Dette gør sæt kompatible med Maps.

Eksempel

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

Prøv det selv →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>Set.keys() 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.keys();
</script>

</body>
</html>

Metoden entries()

Et sæt har ingen nøgler.

entries() returnerer [værdi,værdi]-par i stedet for [nøgle,værdi]-par.

Dette gør sæt kompatible med Maps:

Eksempel

// Create an Iterator
const myIterator = letters.entries();

// List all Entries
let text = "";
for (const entry of myIterator) {
  text += entry;
}

Prøv det selv →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>entries() Returns an Iterator with [value,value] pairs from a Set:</p>

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

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

// List all entries
const iterator = letters.entries();
let text = "";
for (const entry of iterator) {
  text += entry + "<br>";
}

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

</body>
</html>

Sæt er objekter

For et sæt returnerer typeof objekt:

typeof letters;      // Returns object

Prøv det selv →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets Objects</h2>
<p>The typeof operator returns object:</p>

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

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

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

</body>
</html>

For et sæt returnerer forekomst af sæt true:

letters instanceof Set;  // Returns true

Prøv det selv →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Sets</h2>
<p>The instanceof operator returns true:</p>

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

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

// Display typeof
document.getElementById("demo").innerHTML = letters instanceof Set;
</script>

</body>
</html>