JavaScript Iterables

Indholdsfortegnelse

Iterables er iterable objekter (som Arrays).

Iterables kan tilgås med enkel og effektiv kode.

Iterables kan gentages med for..of sløjfer

For Of Loop

JavaScript for..of-sætningsløkkerne gennem elementerne i et iterabelt objekt.

Syntaks

for (variable of iterable) {
  // code block to be executed
}

Iteration

Iteration er let at forstå.

Det betyder ganske enkelt at gå i løkker over en sekvens af elementer.

Her er nogle nemme eksempler:

Iteration over en streng
Iteration over et array

Iteration over en streng

Du kan bruge en for..of-løkke til at iterere over elementerne i en streng:

Eksempel

const name = "W3Schools";

for (const x of name) {
  // code block to be executed
}

Prøv det selv →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Iterables</h2>
<p>Iterate over a String:</p>

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

<script>
// Create a String
const name = "W3Schools";

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

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

Iteration over et array

Du kan bruge en for..of-løkke til at iterere over elementerne i et array:

Eksempel

const letters = ["a","b","c"];

for (const x of letters) {
  // code block to be executed
}

Prøv det selv →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Iterables</h2>
<p>Iterate over an Array:</p>

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

<script>
// Create aa Array
const letters = ["a","b","c"];

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

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

Du kan lære flere detaljer om Iterables i kapitlet JS Object Iterables.

Iteration over et sæt

Du kan bruge en for..of-løkke til at iterere over elementerne i et sæt:

Eksempel

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

for (const x of letters) {
  // code block to be executed
}

Prøv det selv →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Iterables</h2>
<p>Iterate over a Set:</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) {
  text += x + "<br>";
}

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

Sæt og kort er dækket i de næste kapitler.

Iteration over et kort

Du kan bruge en for..of-løkke til at iterere over elementerne i et kort:

Eksempel

const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

for (const x of fruits) {
  // code block to be executed
}

Prøv det selv →

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Iterables</h2>
<p>Iterate over a Map:</p>

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

<script>
// Create a Map
const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

// List all entries
let text = "";
for (const x of fruits) {
  text += x + "<br>";
}

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