Variáveis em JavaScript
Você já viu comentários: notas para pessoas, não um depósito para o programa. Agora entram as variáveis — caixas com nome que guardam um valor para você não digitar o mesmo número ou texto o tempo todo.
O que é uma variável em JavaScript e como declará-la?
Uma variável é um nome que guarda um valor. Com let ou const você cria o nome (declara) e com = coloca um valor. Depois usa o nome em vez de repetir o valor. Se puder mudar depois, use let; se deve ficar igual após a primeira atribuição, const. Em código antigo às vezes aparece var; para iniciantes neste curso bastam e preferimos let e const.
Qual palavra-chave escolher?
📊 Escolher let, const ou var no início
| Palavra | Exemplo | Dica para iniciantes |
|---|---|---|
let |
let score = 10; |
Crie um nome; depois pode atribuir outro valor |
const |
const city = "Oslo"; |
Crie um nome; não reatribua após o primeiro valor |
var |
var old = 1; |
Estilo antigo; funciona, mas aqui prefira let / const |
Sinal = |
score = 15; |
Coloca um valor num nome já declarado com let |
| Ler o nome | console.log(score); |
Traz o valor guardado — o nome representa os dados |
Declare com let e veja o valor
let cria o nome. O primeiro = coloca o valor. Com console.log você vê na console.
let greeting = "Hello";
console.log(greeting);
Declare com const
const também guarda valor; trate a primeira atribuição como definitiva para esse nome.
const course = "JavaScript";
console.log(course);
Mude um valor let
Com let você pode usar = de novo. O nome fica; só o conteúdo muda.
let score = 10;
score = 15;
console.log(score);
A console mostra 15 — a atribuição posterior substituiu 10.
Primeiro o nome, depois o valor
Às vezes você escreve só let status; e atribui na linha seguinte. Enquanto não houver nada dentro, não use como se já tivesse um valor útil.
let status;
status = "Ready";
console.log(status);
Dois nomes numa expressão
Os nomes podem aparecer numa expressão. O motor lê cada valor guardado e calcula o resultado.
let a = 2;
let b = 3;
console.log(a + b);
Mostre o valor na página
Guarde o texto numa variável e passe esse nome a textContent. Mude só a string da variável e recarregue — o título atualiza.
<!DOCTYPE html>
<html>
<head>
<title>Variables — Page value</title>
</head>
<body>
<h1 id="msg">Waiting…</h1>
<script>
let message = "Variables hold values";
document.getElementById("msg").textContent = message;
</script>
</body>
</html>
O título mostra o que está em message. A variável é o recipiente reutilizável; a linha DOM só coloca a saída na página — habilidade que você já praticou.
Experimente você
- Crie um
letcom seu nome como string, registre, atribua outra string e registre de novo. - Crie um
constpara nome de cidade e registre. Não reatribua; se tentar, há erro — remova essa linha. - Escreva
let total;, depoistotal = 5;e registretotal. - Dois números com
lete a soma com+. - No demo HTML mude só a string de
message, recarregue e confira o título.
Erros comuns
- Usar o nome antes de declarar (ou antes de um valor útil)
- Escrever
const score = 1;e depoisscore = 2;—constrejeita - Colocar o número só num comentário e esperar que o programa «lembre» — comentário não armazena
- Achar que todo exemplo precisa de
var— este curso prefereleteconst - Nomes ilegais ou confusos (espaços, começar com dígito) — reveja identificadores em Sintaxe
Resumo
- Variável é um recipiente com nome para um valor reutilizável
- Declare com
letouconst, atribua com= - Reatribua com
let; mantenhaconstfixo após o primeiro valor - Em código iniciante, prefira
leteconstao antigovar - Em seguida: tipos de dados — que espécies de valores uma variável pode guardar
🧠 Teste Seu Conhecimento
Teste Seu Conhecimento
Desafie-se com este questionário interativo e veja o quão bem você entende o tópico
📝 Instruções
- Leia cada pergunta cuidadosamente
- Selecione a melhor resposta para cada pergunta
- Você pode refazer o quiz quantas vezes quiser
- Seu progresso será mostrado no topo