Loop While em JavaScript

O que é um loop while em JavaScript?

Um loop while é uma das estruturas de controle mais fundamentais do JavaScript. Ele permite executar um bloco de código repetidamente enquanto uma condição especificada permanecer verdadeira. Pense nisso como dizer ao seu código: “Continue fazendo isso enquanto algo for verdadeiro.”

Sintaxe básica do loop while

A sintaxe de um loop while é direta:

while(codition)
{
    //código que será exetutado
}

O loop continua rodando enquanto a condition for avaliada como true. Assim que a condição se tornar false, o loop para de executar.

Exemplo prático: contando de 0 a 9

Vamos ver um exemplo clássico que demonstra como os loops while funcionam:

let x = 0;
while (x <10) 
{
  console.log("O valor de x: " + x);
  x++

Saída:

O valor de x: 0
O valor de x: 1
O valor de x: 2
O valor de x: 3
O valor de x: 4
O valor de x: 5
O valor de x: 6
O valor de x: 7
O valor de x: 8
O valor de x: 9

Como esse loop funciona: passo a passo

1. Inicialização: x começa em 0.
2. Verificação da condição: o loop verifica se x < 10 (verdadeiro).
3. Execução: o código dentro das chaves roda, imprimindo o valor atual.
4. Incremento: x++ soma 1 a x (equivalente a x = x + 1).
5. Repetição: os passos 2–4 se repetem até x chegar a 10.

Por que ele para no 9?

Quando x chega a 10, a condição x < 10 se torna falsa, o que encerra o loop. É por isso que o último valor exibido é 9, e não 10.

Entendendo o operador de incremento

O operador x++ é uma forma abreviada de somar 1 a x. Aqui estão formas equivalentes de escrever isso:

• x++;
• x = x + 1;
• x += 1;

As três produzem o mesmo resultado, mas o x++ é a forma mais concisa e a mais usada em loops.

Padrões comuns de loop while

Contagem regressiva

let contagem = 10;

while (contagem > 0){
  console.log(contagem);
  contagem--;
}  
console.log("Decolar");

Aumentando de 2 em 2

let numero = 0;

while(numero <= 20){
  document.write("</br>" + numero);
  numero += 2;
}

Tendo como saída: 0, 2, 4, 6, 8, 10, 12, 14, 16, 18, 20

Aumentando até um limite

let adicao = 0; //onde o resultado de i+1 ficará armazenado
let i = 1; //contador para controlar quantas vezes o loop vai rodar e qual número será somado

while(i <= 5){
  adicao += i;
  i++;
}
console.log("Soma: " + adicao);

Saídas:

• Primeira rodada: i é menor ou igual a 5? sim, i = 1, então adicao + i = 1, (0+1), depois i++, i passa a ser 2
• Segunda rodada: i = 2, é menor que 5, então, adicão + i = 1 + 2 = 3, depois i++, i passa a ser 3
• Terceira rodada: i = 3, é menor que 5, então, adicao + i = 3 + 3 = 6, depois, i++, i passa a ser 4
• Quarta rodada: i = 4, é menor que 5, então, adicao + i = 6 + 4 = 10, depois i++, i passa a ser 5
• Quinta rodada: i = 5, i é igual a 5, então, adicao + i = 10 + 5 = 15, e depois, i++, i passa a ser 6
• Sexta rodada: i = 6, é maior que 5, então o loop termina e retorna no console o valor de adicao

Ao adicionarmos i <= 5 como condicional dentro do loop, determinamos que a variável “adicao” irá pegar o valor de i e aumentará de 1 em 1 ( adicao += i; i++;) até que o valor de i seja menor ou igual a 5.

⚠️ A armadilha do loop infinito

Um dos erros mais comuns ao trabalhar com loops while é criar um loop infinito, um loop que nunca para de executar. Isso acontece quando a condição nunca se torna falsa:

let x = 0; 
while(x <10){
  console.log("</br> O valor de x é: " + x);
}

Sinais de alerta de loops infinitos:

• Esquecer de atualizar a variável do loop.
• Atualizar a variável na direção errada.
• Usar operadores de comparação incorretos.

Sempre garanta que o seu loop tenha uma condição de saída clara!

Loop while vs loop for

Os loops while são melhores quando:

• Você não sabe de antemão quantas iterações vai precisar.
• O loop depende de condições externas.
• Você está lendo dados até que uma condição específica seja atendida.

Os loops for são melhores quando:

• Você sabe exatamente quantas iterações precisa.
• Você está iterando sobre uma faixa de números.
• Você quer inicialização, condição e incremento em uma única linha.

Melhores práticas

1. Sempre inicialize o seu contador antes do loop.
2. Garanta que a condição possa se tornar falsa para evitar loops infinitos.
3. Atualize a variável do loop dentro do corpo do loop.
4. Use nomes de variáveis significativos em vez de letras soltas no código de produção.
5. Considere usar um loop for se você souber o número exato de iterações.

Conclusão

O loop while do JavaScript é uma ferramenta poderosa para executar código repetidamente com base em condições. Ao entender como a condição, a execução e o incremento funcionam juntos, você pode escrever loops eficientes que resolvem problemas reais de programação. Lembre-se sempre de incluir uma forma do seu loop terminar.