Un ensemble JavaScript est une collection de valeurs uniques.
Chaque valeur ne peut apparaître qu'une seule fois dans un ensemble.
Un Set peut contenir n’importe quelle valeur de n’importe quel type de données.
Crée un nouvel ensemble
Ajoute un nouvel élément à l'ensemble
Supprime un élément d'un ensemble
Renvoie vrai si une valeur existe
Supprime tous les éléments d'un ensemble
Appelle un rappel pour chaque élément
Renvoie un itérateur avec toutes les valeurs d'un ensemble
Identique aux valeurs()
Renvoie un itérateur avec les paires [valeur, valeur] d'un ensemble
Renvoie les éléments numériques dans un ensemble
Vous pouvez créer un ensemble JavaScript en :
Passer un tableau à new Set()
Créez un nouvel ensemble et utilisez add()
pour ajouter des valeurs
Créez un nouvel ensemble et utilisez add()
pour ajouter des variables
Set()
Passez un Array au constructeur new Set()
:
// Create a Set
const letters = new Set(["a","b","c"]);
Essayez-le vous-même →
<!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>
Créez un ensemble et ajoutez des valeurs littérales :
// Create a Set
const letters = new Set();
// Add Values to the Set
letters.add("a");
letters.add("b");
letters.add("c");
Essayez-le vous-même →
<!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>
Créez un ensemble et ajoutez des variables :
// 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);
Essayez-le vous-même →
<!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()
letters.add("d");
letters.add("e");
Essayez-le vous-même →
<!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>
Si vous ajoutez des éléments égaux, seul le premier sera enregistré :
letters.add("a");
letters.add("b");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");
letters.add("c");
Essayez-le vous-même →
<!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()
La méthode forEach()
appelle une fonction pour chaque élément Set :
// Create a Set
const letters = new Set(["a","b","c"]);
// List all entries
let text = "";
letters.forEach (function(value) {
text += value;
})
Essayez-le vous-même →
<!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()
La méthode values()
renvoie un objet Iterator contenant toutes les valeurs d'un Set :
letters.values() // Returns [object Set Iterator]
Essayez-le vous-même →
<!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>
Vous pouvez maintenant utiliser l'objet Iterator pour accéder aux éléments :
// Create an Iterator
const myIterator = letters.values();
// List all Values
let text = "";
for (const entry of myIterator) {
text += entry;
}
Essayez-le vous-même →
<!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>
keys()
Un ensemble n'a pas de clés.
keys()
renvoie la même chose que valeurs()
.
Cela rend les ensembles compatibles avec Maps.
letters.keys() // Returns [object Set Iterator]
Essayez-le vous-même →
<!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>
entries()
Un ensemble n'a pas de clés.
entries()
renvoie les paires [valeur, valeur] au lieu des paires [clé, valeur].
Cela rend les ensembles compatibles avec Maps :
// Create an Iterator
const myIterator = letters.entries();
// List all Entries
let text = "";
for (const entry of myIterator) {
text += entry;
}
Essayez-le vous-même →
<!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>
Pour un Set, typeof
renvoie l'objet :
typeof letters; // Returns object
Essayez-le vous-même →
<!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>
Pour un Set, instanceof Set
renvoie true :
letters instanceof Set; // Returns true
Essayez-le vous-même →
<!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>