Laços de Repetição: for, while e do...while em JavaScript
Bem-vindo(a) ao post no blog.
🧠 O que é
um Laço de Repetição
Em programação, muitas vezes é necessário repetir a mesma ação várias vezes — por exemplo, exibir uma sequência de números, somar valores, percorrer listas etc.
💬 Em vez de escrever o mesmo código várias vezes como no exemplo:
console.log(1);
console.log(2);
console.log(3);
console.log(4);
console.log(5);
Usamos um laço (loop), que faz essa repetição automática e controlada.
💡 Definição:
Um laço de repetição executa um bloco de código enquanto uma condição for verdadeira ou por um número determinado de vezes.
Cuidado, Dev! Se a sua condição nunca for falsa, você terá um 'loop infinito'. Isso consome toda a memória do navegador e faz a página travar. Sempre verifique se o seu contador está aumentando corretamente!
🔹 Tipos de Laço
O JavaScript possui três formas principais de repetição:
|
Tipo |
Quando usar |
|
for |
Quando você já sabe quantas vezes quer repetir |
|
while |
Quando não se sabe o número exato de repetições (depende de uma condição) |
|
do...while |
Quando deseja executar pelo menos uma vez, mesmo que a condição seja falsa |
Vamos entender cada um detalhadamente.
⚙️ O Loop for
O for é o
tipo de laço mais usado.
Ideal quando você sabe exatamente quantas
vezes algo deve ser feito.
Sintaxe:
for (inicialização; condição; incremento) {
// código a ser executado
}
💬 Etapas explicadas:
1. Inicialização → define a variável de controle.
2. Condição → enquanto for verdadeira, o loop continua.
3. Incremento → atualiza a variável após cada repetição.
Exemplo 1 — Contagem simples
for (let i = 1; i <= 5; i++) {
console.log("Contagem:", i);
}
Resultado:
Contagem: 1
Contagem: 2
Contagem: 3
Contagem: 4
Contagem: 5
💡 Aqui:
● let i = 1 → começa em 1;
● i <= 5 → repete até que i seja 5;
● i++ → soma 1 a cada ciclo.
Exemplo 2 — Tabuada
let numero = 7;
for (let i = 1; i <= 10; i++) {
console.log(`${numero} x ${i} = ${numero * i}`);
}
Resultado:
7 x 1 = 7
7 x 2 = 14
...
7 x 10 = 70
💬 Repare no uso das template strings (${ }) para montar frases dinâmicas.
🔁 O Loop while
while
significa “enquanto”.
Ele repete um bloco enquanto a
condição for verdadeira.
Sintaxe:
while (condição) {
// código a ser executado repetidamente
}
⚠️ Cuidado: se a condição nunca se tornar falsa, o loop será infinito e travará a execução.
Exemplo 1 — Contagem com while
let contador = 1;
while (contador <= 5) {
console.log("Número:", contador);
contador++;
}
Saída:
Número: 1
Número: 2
...
Número: 5
💬 Mesmo resultado do for, mas aqui o controle depende do programador atualizar manualmente o contador.
Exemplo 2 — Digitando até parar
let nome;
while (nome !== "sair") {
nome = prompt("Digite seu nome (ou 'sair' para encerrar):");
console.log("Você digitou:", nome);
}
💡 O loop só termina quando o usuário digita "sair".
Esse é um exemplo clássico de uso
prático de while.
🔄 O Loop do...while
A diferença entre while e do...while é simples, mas importante:
● while → verifica primeiro, depois executa.
● do...while → executa primeiro, depois verifica.
Sintaxe:
do {
// código a executar
} while (condição);
Exemplo — Perguntar até confirmar
let resposta;
do {
resposta = prompt("Deseja continuar? (s/n)");
} while (resposta === "s");
alert("Programa encerrado!");
💡 Nesse caso, o código dentro do do roda pelo menos uma vez, mesmo que a condição seja falsa.
⚙️ Controlando Laços com break e continue
break →
encerra o loop imediatamente
for (let i = 1; i <= 10; i++) {
if (i === 5) break;
console.log(i);
}
Saída:
1
2
3
4
💬 O loop é interrompido quando i chega a 5.
continue →
pula para a próxima iteração
for (let i = 1; i <= 10; i++) {
if (i === 5) continue;
console.log(i);
}
Saída:
1
2
3
4
6
7
8
9
10
💬 A linha 5 é “pulada”, mas o resto continua normalmente.
🧩 Exemplo Prático — Somando Números
let total = 0;
for (let i = 1; i <= 5; i++) {
let numero = Number(prompt(`Digite o número ${i}:`));
total += numero;
}
alert(`A soma total é: ${total}`);
💡 Este exemplo mostra o uso do loop for para coletar dados iterativamente.
📊 Exemplo com While — Descobrir Número Secreto
const numeroSecreto = 7;
let tentativa;
while (tentativa !== numeroSecreto) {
tentativa = Number(prompt("Adivinhe o número entre 1 e 10:"));
if (tentativa === numeroSecreto) {
alert("Você acertou! 🎉");
} else {
alert("Errado, tente novamente!");
}
}
💬 A execução só termina quando o número correto é adivinhado.
🧮 Exemplo Completo — Menu Interativo
let opcao;
do {
opcao = Number(prompt(`
Escolha uma opção:
1 - Olá, mundo!
2 - Contar até 5
3 - Sair
`));
switch (opcao) {
case 1:
alert("Olá, mundo!");
break;
case 2:
for (let i = 1; i <= 5; i++) {
console.log("Número:", i);
}
break;
case 3:
alert("Encerrando programa...");
break;
default:
alert("Opção inválida!");
}
} while (opcao !== 3);
💬 Aqui, combinamos do...while + switch + for
para criar um menu real.
Esse tipo de estrutura é muito usada em
sistemas interativos.
⚠️ Cuidado com Loops Infinitos
Se você esquecer de atualizar a variável de controle ou criar uma condição impossível de se tornar falsa, o loop nunca termina.
Exemplo perigoso:
let x = 1;
while (x > 0) {
console.log("Loop infinito!");
}
💬 Como x nunca é alterado, o while não tem fim.
Sempre certifique-se de que a
condição de parada existe.
💻 Exercício Prático — Números Pares
Crie um programa que exiba todos os números pares de 1 até 20:
for (let i = 1; i <= 20; i++) {
if (i % 2 === 0) {
console.log(i);
}
}
Saída:
2, 4, 6, ..., 20
💡 Desafio: modifique o código para usar while em vez de for.
💬 Desafio — Fatorial de um Número
Peça um número ao usuário e calcule seu fatorial (ex: 5! = 5×4×3×2×1).
💡 Dica de solução:
let n = Number(prompt("Digite um número:"));
let resultado = 1;
for (let i = n; i >= 1; i--) {
resultado *= i;
}
alert(`O fatorial de ${n} é ${resultado}`);
🧩 Exemplo Visual — Desenhar Estrelas
let linhas = 5;
let desenho = "";
for (let i = 1; i <= linhas; i++) {
desenho += "*".repeat(i) + "\n";
}
console.log(desenho);
Resultado:
*
**
***
****
*****
💬 Aqui, usamos repetição para gerar padrões visuais, um ótimo exercício de lógica.
🧠 Revisão
✅
Entendeu o que são laços de repetição;
✅ Aprendeu as estruturas for, while e do...while;
✅ Viu a diferença entre executá-las com
ou sem condições conhecidas;
✅ Usou break e continue
para controlar o fluxo;
✅ Criou exemplos reais, de
menu, tabuada, fatorial e interação.
🎓 Conclusão
Os laços de repetição são uma das ferramentas mais
poderosas da programação.
Eles permitem automatizar tarefas,
percorrer listas, coletar dados e construir estruturas dinâmicas.
A partir de agora, você será capaz de desenvolver códigos mais eficientes, inteligentes e organizados.
E na próxima aula, iremos abordar um tema que leva isso ainda mais longe: funções — blocos reutilizáveis de código que podem ser chamados quando e quantas vezes quiser! 🔁✨
Comentários
Postar um comentário