Repetição: while e do...while

Por que repetir?

Para não escrever o mesmo código várias vezes. Uma estrutura de repetição (também chamada de laço ou loop) executa um bloco de novo e de novo, até a condição de parada ficar falsa.

1. while (enquanto)

Testa a condição antes de cada rodada.

let contador = 1; // variável contadora
let soma = 0;     // variável acumuladora

while (contador <= 10) {
  console.log(contador);
  soma += contador;   // soma = soma + contador
  contador++;         // contador = contador + 1
}

console.log("O somatório é: " + soma); // 55

• Leia assim: "enquanto contador for menor ou igual a 10, faça".
• Contadora: soma um valor fixo a cada rodada (contador++, ou contador += 2 para contar de 2 em 2).
• Acumuladora: soma o que quer acumular (soma += contador).
• Cuidado: se o contador nunca mudar, a condição nunca fica falsa e o laço não para (loop infinito). A página trava.

2. do...while (faça... enquanto)

Mesma ideia, mas a condição fica no fim. Por isso o bloco roda pelo menos uma vez, mesmo que a condição seja falsa. Repare no ; depois do while.

let contador = 1;
let soma = 0;

do {
  console.log(contador);
  soma += contador;
  contador++;
} while (contador <= 10);

console.log("O somatório é: " + soma); // 55

3. Teste de mesa

Montar uma tabela com o valor das variáveis a cada rodada é chamado de teste de mesa (ou teste chinês). Serve para entender e conferir o que o laço faz.

Começando em 1, os dois botões dão o mesmo resultado. Começando depois do fim, eles se separam (veja a seção 4).

Código desta seção: js/repeticao.js, seções 1 a 3.

4. A diferença na prática

A condição é contador <= 10. Comece o contador em 11: a condição já nasce falsa. O while não roda nenhuma vez; o do...while roda uma.

Código desta seção: js/repeticao.js, seção 4.

5. Média de N notas

O programa pergunta quantas notas são, e o while pede uma nota por rodada, acumulando na soma.

let contador = 1;
const qtd = Number(prompt("Quantas notas?"));
let soma = 0;
let nota = 0;

while (contador <= qtd) {
  nota = Number(prompt("Digite a nota"));
  soma += nota;        // acumuladora
  contador++;          // contadora
}

console.log("Média: " + soma / qtd);

Cuidado com o Number(): o prompt devolve texto, e sem converter a soma vira "0" + "7" + "8" = "078".

O código acima não tem proteção: se cancelar, a nota vira 0 e a média sai errada (ou NaN). O botão abaixo trata isso: aceita vírgula (8,5) e, se a nota for inválida, pede a mesma de novo com continue.

Acompanhar as variáveis numa tabela (como no Excel) é o teste de mesa. O botão abaixo monta essa tabela para você.

Código desta seção: js/repeticao.js, seção 5.

while ou do...while?

Na maioria das vezes, while. O do...while é pouco usado, porque é raro querer rodar um bloco mesmo com a condição falsa. Um caso comum: pedir um dado ao usuário e repetir a pergunta enquanto a resposta for inválida (é preciso perguntar pelo menos uma vez).