Ein JavaScript-Set ist eine Sammlung eindeutiger Werte.
Jeder Wert kann in einem Set nur einmal vorkommen.
Erstellt ein neues Set
Fügt dem Set ein neues Element hinzu
Entfernt ein Element aus einem Set
Gibt true zurück, wenn im Set ein Wert vorhanden ist
Ruft einen Rückruf für jedes Element im Set auf
Gibt einen Iterator mit allen Werten in einem Set zurück
Gibt die Anzahl der Elemente in einem Set zurück
Sie können ein JavaScript-Set erstellen, indem Sie:
Übergabe eines Arrays an new Set()
Erstellen Sie ein neues Set und verwenden Sie add()
, um Werte hinzuzufügen
Erstellen Sie ein neues Set und verwenden Sie add()
, um Variablen hinzuzufügen
new Set()
-MethodeÜbergeben Sie ein Array an den Konstruktor new Set()
:
// Create a Set
const letters = new Set(["a","b","c"]);
Probieren Sie es selbst aus →
<!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>
Erstellen Sie einen Satz und fügen Sie Werte hinzu:
// Create a Set
const letters = new Set();
// Add Values to the Set
letters.add("a");
letters.add("b");
letters.add("c");
Probieren Sie es selbst aus →
<!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>
Erstellen Sie ein Set und fügen Sie Variablen hinzu:
// 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);
Probieren Sie es selbst aus →
<!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>
add()
-Methodeletters.add("d");
letters.add("e");
Probieren Sie es selbst aus →
<!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>
Wenn Sie gleiche Elemente hinzufügen, wird nur das erste gespeichert:
letters.add("a");
letters.add("b");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");
Probieren Sie es selbst aus →
<!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>
forEach()
-MethodeDie Methode forEach()
ruft eine Funktion für jedes Set-Element auf:
// Create a Set
const letters = new Set(["a","b","c"]);
// List all Elements
let text = "";
letters.forEach (function(value) {
text += value;
})
Probieren Sie es selbst aus →
<!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>
values()
-MethodeDie Methode values()
gibt ein neues Iteratorobjekt zurück, das alle Werte in einem Set enthält:
letters.values() // Returns [object Set Iterator]
Probieren Sie es selbst aus →
<!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>
Jetzt können Sie das Iterator-Objekt verwenden, um auf die Elemente zuzugreifen:
// List all Elements
let text = "";
for (const x of letters.values()) {
text += x;
}
Probieren Sie es selbst aus →
<!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>