Qual a diferença de = == e === em JavaScript

Neste artigo você vai aprender qual a diferença de = == e === em JavaScript, a partir de uma explicação prática e sucinta

Resumo rápido dos três: o = atribui um valor a uma variável (const nome = "Matheus")

O == compara dois valores fazendo coerção de tipo antes, por isso 1 == "1" retorna true

O === compara valor E tipo sem coerção nenhuma, por isso 1 === "1" retorna false

Na dúvida, use === como padrão

Fala programador(a), beleza? Bora aprender mais sobre os operadores de JavaScript!

Primeiramente temos que separar algumas coisas, o operador de igual tem uma categoria diferente dos operadores == e ===

Eles são separados em:

• Atribuição: que é o caso do =
• Comparação: que é o caso de == e ===

O de atribuição é mais simples de entender, pois basicamente permite que um valor seja atribuído a uma variável, por exemplo

Então veja um exemplo onde utilizamos o operador de atribuição:

const name = "Matheus"

console.log(name) // Matheus

Aqui estamos criando uma variável e atribuindo o valor de Matheus a ela

Ou seja, esta é a função do operador de igual

Um dos erros dos iniciantes de programação é confundir este operador com o da matemática que vemos na escola, que geralmente identifica a igualdade entre dois valores

Operador == e ===

Já os operadores == e === tem como função comparar valores

Comparações retornam um booleano, true ou false

Ou seja, quando os utilizamos estamos procurando validar algo

A grande diferença ocorre no ===, onde o tipo de dado é comparado também

Então podemos ter resultados diferentes com operações quase iguais, veja:

console.log(1 == "1") // true

console.log(1 === "1") // false

Esta pequena diferença pode gerar grandes dores de cabeça ao seu software

Por isso, procure sempre utilizar ===, ele vai garantir que as operações sempre tenham o resultado correto

Mesmo que este não seja o que você está esperando 🙂

Conclusão

Neste artigo você aprendeu a diferença de = == e === em JavaScript

Temos que:

• = é um operador de atribuição, ele coloca valores em variávies;
• == é operador de comparação, que verificar se dois valores são iguais;
• === é também um operador de comparação, porém compara os tipos dos valores e também os valores;

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias! Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias. O link acima contém um cupom de desconto para os cursos

Uma explicação curta do PORQUÊ o 1 == "1" dá true: o == faz coerção de tipo, ou seja, ele converte a string "1" para número antes de comparar, então sobra 1 == 1 e o resultado é true

Já o === é o operador de igualdade estrita

Ele não coage nada, compara o valor E o tipo ao mesmo tempo

Como um é number e o outro é string, o 1 === "1" já cai fora e volta false, sem nem olhar o valor

Um caso legítimo de == que quase ninguém conta

O padrão x == null pega null OU undefined de uma vez só, porque o == trata os dois como equivalentes

É tão usado que o próprio ESLint, na regra eqeqeq (que força === e !==), tem uma opção pra liberar essa exceção: { "null": "ignore" }

Ou seja, a recomendação da comunidade é usar === como padrão, e abrir mão dele só no x == null quando tu quer checar null e undefined juntos

Não tenho material próprio testado especificamente sobre == e ===: o vídeo disponível é sobre diferença entre datas, outro assunto. Pra escrever um bloco de primeira mão honesto aqui, o certo seria abrir o console do navegador e rodar os casos lado a lado (1 == "1", 1 === "1", 0 == "", x == null com variável indefinida) mostrando o retorno de cada um. Sem essa rodada real, não afirmo experiência que não tive

Perguntas frequentes

Qual a diferença entre == e === em JavaScript?

O == é o operador de igualdade frouxa: ele faz coerção de tipo antes de comparar, então converte os valores pro mesmo tipo e só depois checa

O === é o operador de igualdade estrita: ele compara o valor E o tipo juntos, sem converter nada

Por isso 1 == "1" volta true (a string vira número), mas 1 === "1" volta false (number e string são tipos diferentes)

1 == "1" é true ou false em JavaScript?

1 == "1" é true, porque o == coage a string "1" para número antes de comparar

Já 1 === "1" é false, porque o === exige mesmo tipo e valor, e aqui os tipos são diferentes (number vs string)

Devo sempre usar === no lugar de ==?

Como regra geral sim, o === evita surpresas de coerção de tipo e deixa a comparação previsível

A regra eqeqeq do ESLint inclusive força o uso de === e !==

A exceção mais comum é o x == null, que checa null e undefined de uma vez: a própria regra do ESLint tem a opção { "null": "ignore" } pra liberar esse caso

Leia também

• JavaScript: diferença entre == e ===