Итерации JavaScript

Оглавление

    Показать оглавление

Итерируемые объекты — это итерируемые объекты (например, массивы).

Доступ к итерируемым объектам можно получить с помощью простого и эффективного кода.

Итерации можно перебирать с помощью циклов for..of

Цикл For

Оператор JavaScript for..of зацикливается через элементы итерируемого объекта.

Синтаксис

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

Итерация

Итерацию легко понять.

Это просто означает цикл по последовательности элементов.

Вот несколько простых примеров:

  • Итерация по строке

  • Итерация по массиву

Итерация по строке

Вы можете использовать цикл for..of для перебора элементов строки:

Пример

const name = "W3Schools";

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

Попробуйте сами →

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

Итерация по массиву

Вы можете использовать цикл for..of для перебора элементов массива:

Пример

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

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

Попробуйте сами →

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

Более подробную информацию об Iterables можно узнать в главе «Итерации объектов JS».

Итерация по набору

Вы можете использовать цикл for..of для перебора элементов набора:

Пример

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

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

Попробуйте сами →

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

Наборы и карты рассматриваются в следующих главах.

Итерация по карте

Вы можете использовать цикл for..of для перебора элементов карты:

Пример

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

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

Попробуйте сами →

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