JavaScript: Operadores em JavaScript

Última atualização: 2026-10-13

Operadores são símbolos que dizem ao JavaScript qual operação realizar. Você usa + para adição todos os dias, mas os operadores do JS vão muito além da aritmética — atribuição, comparação e avaliação lógica dependem deles. Esta lição cobre os operadores mais usados de uma vez.

Métodos matemáticos：Math.pow() if...else

1. Operadores Aritméticos

O operador de resto % é especialmente útil — verificar par/ímpar,🦄 em loops, e mais. ** é o operador de exponenciação adicionado no ES2016, equivalente a Math.pow() mas mais conciso.

A diferença entre prefixo e postfixo ++ / --: prefixo altera primeiro e depois retorna, postfixo retorna primeiro e depois altera. Não encadeie múltiplos ++ na mesma linha — o código vira um enigma ilegível.

<!DOCTYPE html>
<html lang="pt-br">
<head>
  <meta charset="UTF-8">
  <title>Operadores Aritméticos</title>
</head>
<body>
  <h3>Demonstração de Operadores Aritméticos</h3>
  <pre id="output"></pre>
  <script>
    var out = document.getElementById('output');
    var a = 17, b = 5;

    var lines = [];
    lines.push('a = ' + a + ', b = ' + b);
    lines.push('a + b  = ' + (a + b));
    lines.push('a - b  = ' + (a - b));
    lines.push('a * b  = ' + (a * b));
    lines.push('a / b  = ' + (a / b));
    lines.push('a % b  = ' + (a % b));
    lines.push('a ** b = ' + (a ** b));

    var x = 10;
    lines.push('');
    lines.push('x = 10');
    lines.push('x++  = ' + (x++) + '  (postfixo: retorna valor antigo, x vira ' + x + ')');
    lines.push('++x  = ' + (++x) + '  (prefixo: altera primeiro, x vira ' + x + ')');

    out.textContent = lines.join('\n');
  </script>
</body>
</html>

2. Operadores de Atribuição

= é atribuição, não "igual" no sentido matemático. Esta é uma das armadilhas mais comuns para iniciantes — if (x = 5) não lança um erro; atribui 5 a x e retorna 5 (truthy), então a condição é sempre verdadeira.

Atribuição composta é um atalho:

▶ Exemplo: Operadores de Atribuição

3. Operadores de Comparação

⚠️ A armadilha == vs ===: Esta é a armadilha mais clássica do JavaScript, sem exceção. == realiza coerção de tipo silenciosamente — "5" == 5 é true! Enquanto === exige que tipo e valor coincidam — "5" === 5 é false. Sempre use === a menos que você precise especificamente de coerção de tipo. Da mesma forma, use !== em vez de !=.

▶ Exemplo: A Armadilha == vs ===

Viu? 0 == false e "" == false são ambos true — completamente contra-intuitivo. É como comparar maçãs e laranjas: == diz "ambos são frutas, suficientemente próximos"; === diz "não são iguais, ponto final." Fique com === e você evitará metade dos seus bugs.

4. Operadores Lógicos

&& e || têm um recurso útil chamado avaliação de curto-circuito: && para no primeiro valor falsy, || para no primeiro valor truthy — o resto nunca é avaliado. Isso é comumente usado para atribuições condicionais concisas:

<script>
var nome = entradaUsuario || 'Anônimo';
</script>

▶ Exemplo: Operadores Lógicos e Avaliação de Curto-Circuito

5. O Operador + com Strings

Quando + encontra uma string, ele vira um operador de concatenação: desde que um lado seja string, o outro lado é convertido para string e ambos são unidos.

<script>
"Olá" + " " + "Mundo"   // "Olá Mundo"
"Número: " + 42            // "Número: 42"
3 + 4 + "px"              // "7px" (3+4=7 primeiro, depois concatenado)
"px" + 3 + 4              // "px34" (esquerda para direita: "px"+3="px3", depois +4)
</script>

Aquele "px" + 3 + 4 dando "px34" em vez de "px7" é uma armadilha clássica de entrevista — + avalia da esquerda para a direita, e uma vez que o lado esquerdo é string, tudo depois vira concatenação.

6. Visão Geral do Operador Ternário

O operador ternário é um atalho para if...else, com a sintaxe: condição ? valor1 : valor2.

<script>
var status = idade >= 18 ? 'Adulto' : 'Menor';
</script>

Se a condição for truthy, retorna valor1; caso contrário, valor2. Condições simples funcionam elegantemente com o operador ternário, mas não os aninhe — a ? b ? c : d : e é uma receita para confusão. O uso detalhado é coberto na Lição 10.

7. Precedência de Operadores

JavaScript determina a ordem de avaliação com base na precedência, seguindo as mesmas regras que você aprendeu na aula de matemática: multiplicação e divisão antes de adição e subtração, parênteses primeiro.

<script>
2 + 3 * 4     // 14, não 20
(2 + 3) * 4   // 20
</script>

Precedência comum da mais alta para a mais baixa: () → ! → ** → * / % → + - → > < >= <= → == === != !== → && → || → ?: → =.

Quando em dúvida, adicione parênteses. Parênteses são grátis, mas bugs são caros.

Métodos matemáticos：Math.pow() if...else

❓ Perguntas Frequentes

📖 Resumo

• Operadores aritméticos cuidam de cálculos numéricos; % (resto) e ** (exponenciação) são comumente usados na prática
• Operadores de atribuição composta (+=, -=, etc.) tornam o código mais conciso
• Sempre prefira === e !== para comparações para evitar bugs da coerção implícita de ==
• Operadores lógicos && e || suportam avaliação de curto-circuito, útil para atribuição de valores padrão
• + vira um operador de concatenação quando encontra uma string — cuidado com a ordem de avaliação da esquerda para a direita
• Quando em dúvida sobre precedência, adicione parênteses — legibilidade importa muito mais que economizar alguns caracteres

📝 Exercícios

1. Escreva um programa que recebe um número de três dígitos (ex: 371) e extrai seus dígitos de centena, dezena e unidade usando % e /, depois imprima-os.
2. Sem usar if...else, escreva uma única linha usando o operador ternário para determinar se uma variável de ano year é um ano bissexto, e atribua o resultado a isLeap (dica: divisível por 4 e não por 100, ou divisível por 400).
3. Preveja os resultados das seguintes expressões, depois verifique no console do navegador: [] == false, [] == ![], null == 0. Explique por quê — se não conseguir, significa que você precisa revisar as regras de coerção implícita de ==, e então abrace firmemente o ===.

Equipe Técnica Web-Tutorial

Uma plataforma de tutoriais mantida por diversos desenvolvedores. Cada tutorial é escrito e revisado por profissionais da área correspondente. Trabalhamos para manter nosso conteúdo preciso e confiável — se encontrar algum problema, avise-nos.

Sobre Nós