for...of, for...in, break e continue

Percorrer coleções

Na maioria das vezes você não quer contar números soltos, mas passar pelos elementos de uma lista: os produtos de um carrinho, os nomes de um grupo, as letras de uma palavra. Para isso existem versões do for bem mais cômodas, que se leem quase como uma frase.

for...of: percorre os valores

Ideal para arrays e strings. A cada volta ele te dá diretamente o elemento:

const frutas = ["maçã", "pera", "uva"];
for (const fruta of frutas) {
  console.log(fruta);
}
// "maçã", "pera", "uva"

Também funciona com strings, caractere por caractere:

for (const letra of "abc") {
  console.log(letra); // "a", "b", "c"
}

for...in: percorre as chaves/índices

Pensado para objetos, onde te dá o nome de cada propriedade:

const pessoa = { nome: "Ana", idade: 25 };
for (const chave of pessoa) {} // ❌ isso NÃO funciona
for (const chave in pessoa) {
  console.log(chave, "=>", pessoa[chave]);
}
// "nome => Ana", "idade => 25"

Macete para não se confundir: of é "me dê os valores" de arrays/strings; in é "me dê as chaves" de objetos. Se misturar, não tem problema: até os veteranos hesitam nessa às vezes.

Controlar o fluxo: break e continue

• break sai do laço imediatamente.
• continue pula para a próxima volta, ignorando o resto do corpo.

for (let i = 1; i <= 10; i++) {
  if (i === 5) break;     // ao chegar a 5, paramos de vez
  if (i % 2 === 0) continue; // ignora os pares
  console.log(i);          // imprime 1, 3
}

Exemplos

Percorrer um array com for...of

const cores = ["vermelho", "verde", "azul"];
for (const cor of cores) {
  console.log(cor.toUpperCase());
}

Pular e parar com continue e break

for (let i = 1; i <= 10; i++) {
  if (i % 2 === 0) continue; // pula pares
  if (i > 5) break;          // ao chegar a 7, para de vez
  console.log(i);            // imprime 1, 3, 5
}