Tipos de erros comuns em JavaScript: o que significam as mensagens?

Errar faz parte do processo de programar.
A boa notícia é: mensagem de erro é pista, não inimiga.

Pense como um painel do carro: quando acende uma luz, ele está tentando te avisar de algo específico.

Por que entender mensagens de erro é tão importante?

Porque elas ajudam você a responder 3 perguntas:

1. O que deu errado?
2. Onde deu errado? (arquivo, linha, coluna)
3. Em que contexto aconteceu? (pilha de chamadas / stack trace)

Estrutura comum de uma mensagem de erro

Um erro geralmente mostra:

• tipo do erro (ex.: ReferenceError)
• mensagem (ex.: x is not defined)
• local (arquivo + linha + coluna)
• stack trace (caminho de funções até o erro)

Exemplo:

Uncaught ReferenceError: usuario is not defined
    at app.js:10:15

1) SyntaxError (erro de sintaxe)

Acontece quando o código está “gramaticalmente” inválido.

Exemplo:

if (true {
  console.log("oi");
}

Falta ) no if.

Dica: confira parênteses, chaves, aspas, vírgulas e estrutura geral.

2) ReferenceError (variável não encontrada)

Acontece quando você usa algo que não existe no escopo atual.

Exemplo:

console.log(nomeUsuario);

Se nomeUsuario não foi declarado, aparece ReferenceError.

Dica: revise nomes de variáveis e onde elas foram declaradas.

3) TypeError (tipo incompatível)

Acontece quando você tenta usar um valor de um jeito que não faz sentido.

Exemplo:

const idade = 25;
idade.toUpperCase();

Número não tem toUpperCase, então dá TypeError.

Outro exemplo comum:

const botao = null;
botao.addEventListener("click", () => {});

Se botao é null, não dá para chamar método nele.

4) RangeError (valor fora do intervalo permitido)

Acontece quando um valor está fora do limite esperado.

Exemplo clássico:

const arr = new Array(-1);

Tamanho de array não pode ser negativo.

5) URIError (problema em URL codificada/decodificada)

Mais raro no dia a dia inicial, mas pode aparecer com decodeURIComponent.

Exemplo:

decodeURIComponent("%");

Isso gera erro por formato inválido.

6) Erros lógicos (não quebram o código, mas resultado fica errado)

Nem todo erro aparece em vermelho no console.
Às vezes o código roda, mas entrega resultado incorreto.

Exemplo:

const total = "10" + 5; // "105", não 15

Aqui não quebra, mas a lógica pode estar errada para o objetivo.

Palavras importantes que aparecem no console

• Uncaught: erro não foi tratado.
• is not defined: variável inexistente no escopo.
• Cannot read properties of null/undefined: tentou acessar algo em valor inexistente.
• Unexpected token: erro de sintaxe.
• at arquivo:linha:coluna: local do problema.

Estratégia prática para interpretar erro

1. Leia o tipo do erro.
2. Leia a mensagem completa.
3. Vá para linha e coluna indicadas.
4. Verifique o valor das variáveis próximas.
5. Corrija e teste novamente.

Resumo da lição

• Mensagens de erro são guias para encontrar a causa do problema.
• Tipos comuns: SyntaxError, ReferenceError, TypeError, RangeError, URIError.
• Erro lógico também é importante, mesmo sem “quebrar” o código.
• Ler tipo + mensagem + linha/coluna acelera muito seu debugging.