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.

Væsentlige sætmetoder

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 i sættet

forEach()

Kalder et tilbagekald for hvert element i sættet

values()

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

size

Returnerer antallet af elementer 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

Metoden new Set()

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 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 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);

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() påkalder (kalder) en funktion for hvert sæt-element:

Eksempel

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

// List all Elements
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 nyt iteratorobjekt, 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

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

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>