Loop com Prompt em JavaScript: Só Sai Dizendo "Sair"

POV: Seu loop só para quando você diz a palavra mágica 😂

O detalhe mais interessante é o cuidado com a digitação do usuário: como alguém pode digitar "sair", "SAIR" ou "Sair", o código usa toLowerCase() para converter a resposta para minúsculas antes de comparar com a palavra de saída, garantindo que o loop pare independente de como a pessoa escreveu. Isso evita um erro clássico de quem está aprendendo: comparar strings sem considerar que maiúsculas e minúsculas são tratadas como valores diferentes em JavaScript.

"Esse array vai iniciar vazio. E eu vou colocar um input, que é o que o usuário vai digitar. No nosso input não tem nada. Eu vou criar o while e vou colocar uma condição: enquanto input for diferente de sair. Quando o usuário digitar sair, ele vai sair dessa interação, senão ele vai entrar no loop constante."

🔄 O padrão loop + prompt: interação com o usuário

Um dos padrões mais poderosos para programadores iniciantes é combinar um loop while com a função prompt() . Isso permite criar programas que interagem com o usuário de forma dinâmica, coletando dados até que uma condição de saída seja atingida .

// Array para armazenar as respostas
let animais = [];
let input = "";

// Loop até o usuário digitar "sair"
while (input !== "sair") {
    input = prompt("Escreva o nome de um animal ou digite sair");

    if (input.toLowerCase() === "sair") {
        break;
    }

    animais.push(input);
    console.log("Usuário digitou: " + input);
}
        

🔤 O segredo da comparação: toLowerCase()

Uma das principais armadilhas para programadores iniciantes é esquecer que JavaScript diferencia maiúsculas de minúsculas . O método toLowerCase() resolve esse problema convertendo toda a string para minúsculas .

// ❌ Só funciona se o usuário digitar exatamente "sair"
if (input === "sair") {
    break;
}
// "SAIR", "Sair", "sAIR" NÃO funcionam!
        

// ✅ Funciona com qualquer variação de maiúsculas/minúsculas
if (input.toLowerCase() === "sair") {
    break;
}
// "SAIR", "Sair", "sAIR" TODOS funcionam!
        

📥 O método push(): construindo a lista dinâmica

O método push() é fundamental para construir arrays dinamicamente . Ele adiciona um ou mais elementos ao final do array e retorna o novo comprimento .

let animais = []; // Array vazio

// Adicionando elementos dinamicamente
animais.push("cachorro");
animais.push("gato");
animais.push("elefante");

console.log(animais);
// ["cachorro", "gato", "elefante"]
        

📚 Exemplo completo: coletando animais com loop e prompt

Vamos ver o exemplo completo do vídeo, que demonstra como coletar uma lista de animais do usuário até que ele digite "sair" .

// Array para armazenar os animais
let animais = [];
let input = "";

// Loop principal
while (input.toLowerCase() !== "sair") {
    input = prompt("Escreva o nome de um animal ou digite sair");

    // Se o usuário digitou "sair", sai do loop
    if (input.toLowerCase() === "sair") {
        break;
    }

    // Adiciona o animal ao array
    animais.push(input);
    console.log("Usuário digitou: " + input);
}

// Exibe todos os animais coletados
console.log("Animais coletados:");
for (let i = 0; i < animais.length; i++) {
    console.log(animais[i]);
}
        

📋 Boas práticas com loop e prompt

⏱️ Capítulos do vídeo

• 00:00 — Preparação: Criando um array vazio e a variável para o input
• 00:11 — Estrutura do while: Definindo a condição de saída ("sair")
• 00:25 — Implementação do prompt: Capturando a entrada do usuário
• 00:48 — Manipulando dados: Adicionando as entradas ao array com .push()
• 01:01 — Boas práticas: Usando .toLowerCase() para validar a saída independente de maiúsculas
• 01:21 — Teste prático: Rodando o loop e verificando as entradas no console
• 01:36 — Finalização: Digitando "SAIR" para encerrar a interação e exibir os resultados
• 01:43 — Encerramento e convite para inscrição no canal

🎯 Conclusão

O padrão loop + prompt + array é um dos mais versáteis para programadores iniciantes . Ele combina estruturas de repetição, entrada de dados e armazenamento em um único exemplo prático .

Neste artigo, você aprendeu:

• ✅ Como usar a função prompt() para receber dados do usuário
• ✅ Como criar um array vazio para guardar respostas
• ✅ Como usar um while para repetir a pergunta até uma condição
• ✅ Como definir uma palavra de saída para encerrar o loop
• ✅ Como usar toLowerCase() para ignorar maiúsculas e minúsculas
• ✅ Como adicionar valores dinamicamente dentro de um array

🤔 O que você achou?

💬 Quer aprender JavaScript do ZERO? Comece agora a escrever seu primeiro código e seus fundamentos!

❓ FAQ: Perguntas Frequentes sobre Loop com Prompt em JavaScript

🎬 Assista ao Vídeos completo sobre Refatoração

O vídeo foi feito em Javascript mais o conceito pode ser utilizado em qualquer outra linguagem de programação..

🔗 Conecte-se Comigo