JavaScript para de

Índice

    Mostrar índice

O loop for de

A instrução JavaScript for of faz loops através dos valores de um objeto iterável.

Ele permite que você faça um loop em estruturas de dados iteráveis como Arrays, Strings, Maps, NodeLists e muito mais:

Sintaxe

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

variável - Para cada iteração o valor da próxima propriedade é atribuído à variável. Variável pode ser declarada com const, let ou var.

iterável - Um objeto que possui propriedades iteráveis.

Suporte ao navegador

For/of foi adicionado ao JavaScript em 2015 (ES6)

Safari 7 foi o primeiro navegador com suporte para:

Chrome 38 Edge 12 Firefox 51 Safari 7 Opera 25
Oct 2014 Jul 2015 Oct 2016 Oct 2013 Oct 2014

For/of não é compatível com o Internet Explorer.

Fazendo loop em um array

Exemplo

const cars = ["BMW", "Volvo", "Mini"];

let text = "";
for (let x of cars) {
  text += x;
}

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript For Of Loop</h2>
<p>The for of statement loops through the values of any iterable object:</p>

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

<script>
const cars = ["BMW", "Volvo", "Mini"];

let text = "";
for (let x of cars) {
  text += x + "<br>";
}

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

</body>
</html>

Loop sobre uma string

Exemplo

let language = "JavaScript";

let text = "";
for (let x of language) {
  text += x;
}

Experimente você mesmo →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript For Of Loop</h2>

<p>The for of statement loops through the values of an iterable object.</p>

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

<script>
let language = "JavaScript";

let text = "";
for (let x of language) {
  text += x + "<br>";
}

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

</body>
</html>

O loop while

O loop while e o loop do/while são explicados no próximo capítulo.