Para efetuar o download você precisa estar logado. Clique aqui para efetuar o login

JavaScript: como e quando utilizar os operadores == e ===

Conheça as diferenças entre os operadores == e === (e != e !==) no JavaScript e a influência que eles podem ter no seu código.

Você precisa estar logado para dar um feedback. Clique aqui para efetuar o login
Para efetuar o download você precisa estar logado. Clique aqui para efetuar o login
Confirmar voto
0
 (11)  (0)

Motivação

Um dos principais problemas que iniciantes no JavaScript enfrentam é não saber diferenciar os operadores javascript de igualdade "==" e "===". Esse mesmo comentário é válido para os operadores javascript de 'desigualdade' "!=" e "!==". Por eles não estarem presentes na maioria das linguagens, muitos iniciantes cometem o erro de utilizá-los de forma indiscriminada. Essa falta de conhecimento, no entanto, pode levar a alguns problemas no código, por exemplo, na comparação entre a string "1" e o número, inteiro, 1. Nesse artigo, vamos entender em que situações temos igualdade entre valores e quais operadores devem ser utilizados em casos comuns de uso no dia a dia.

saiba mais Saiba mais sobre JavaScript no Guia de Referência JavaScript

Operadores javascript de igualdade e desigualdade

O JavaScript é uma linguagem com variáveis que não são fortemente tipadas. Isso significa que, embora as variáveis possuam tipos, eles só são atribuídos em tempo de execução. Por isso, não há definição explícita do tipo de dado: tudo é feito utilizando o termo "var". Por exemplo, um dado do tipo inteiro é definido como "var i = 0;", enquanto um dado do tipo string é definido como "var s = 'texto';".

Devido a essa característica, o JavaScript possui dois tipos de operadores de igualdade e dois de desigualdade: "==" e "===" e "!=" e "!==". Em linguagens como o C#, temos somente o primeiro deles. Nessas linguagens, o operador "==" verifica a igualdade entre os valores, considerando, além do valor propriamente dito, o tipo dele.

No JavaScript, como os tipos das variáveis nem sempre são levados em consideração, há duas opções: o operador "==" (e o mesmo vale para o operador "!="), que não leva em consideração o tipo de dados; e o operador "===" (e também "!=="), que considera o tipo de dados, o que possibilita afirmar que os valores são, de fato, iguais.

Igual? Ou parecido?

Então, qual seria a diferença entre trabalhar com "==" ou "===" no JavaScript? Tudo envolve o tipo das variáveis que estão sendo comparadas: "==" não leva esse tipo em consideração, enquanto "===" leva. Logo, expressões como as apresentadas abaixo gerariam resultados diferentes, como é possível verificar pelo nome das variáveis criadas. Assim, o primeiro caso, utilizando "==", é verdadeiro (true), enquanto o segundo caso, utilizando "===", é falso (false). Nesse último, a falsidade ocorre porque o JavaScript leva em consideração o tipo do dado: string não é igual a integer, embora o dado em si seja o mesmo.

  var verdadeiro = '1' == 1;
  var falso = '1' === 1;
  

Para entendermos melhor esse conceito, é importante que façamos a análise de uma série de expressões, como as mostradas na Listagem 1. Repare que temos expressões envolvendo vários tipos de dados.

  01 var var1 = 'true' == true;                 // false
  02 var var2 = '0' == false;                   // true
  03 var var3 = null == undefined;              // true
  04 var var4 = false == null;                  // false
  05 var var5 = null == 0;                      // false
  06 var var6 = '' == 0;                        // true
  07 var var7 = '\t\n' == 0;                    // true
  08 var var8 = '1' == true;                    // true 
  
Listagem 1. Expressões de igualdade/desigualdade

Linha 01: false. Pelo que vimos até agora, algo assim provavelmente seria verdadeiro, uma vez que, visualmente e sem levar em consideração o tipo de dados, os valores são iguais. Entretanto, o JavaScript, internamente, trata os valores true e false como 1 e 0, respectivamente;

Linha 02: true. O motivo é o mesmo atestado na explicação para a linha 01. O JavaScript trata false como 0, internamente;

Linha 03: true. Essencialmente, são valores diferentes. O primeiro denota a ausência de um valor (null), enquanto o segundo denota um valor que ainda não foi definido (undefined). Para o JavaScript, entretanto, são considerados iguais quando não há um tipo envolvido. Como null possui um tipo, expressões como var "varX = null === undefined;" retornam false;

Linhas 04 e 05: ambas resultam em false. O motivo para isso é o mesmo. O valor false é tratado como 0, internamente. Assim, trata-se da comparação da "ausência de valor" (null) com o valor 0;

Linha 06: true. Internamente, a string vazia é tratada como 0, quando o tipo não é considerado;

Linha 07: true. Os valores "\t" (tab) e "\n" (nova linha) não são considerados caracteres. Assim, a string é considerada vazia, recaindo no resultado da linha 06;

Linha 08: true. Pelo mesmo motivo apontado na explicação da linha 01, internamente, o valor true é tratado como 1 pelo JavaScript.

Pelo que podemos observar, existe uma série de discrepâncias entre o comportamento tido como normal, a que estamos acostumados, e o que o "==" nos traz. Assim, salvo em casos muito específicos, sempre utilize o operador "===" (ou "!=="). Ele tornará seu código mais seguro, evitando problemas de tipos diferentes e valores iguais.

Carregando
 
Você precisa estar logado para dar um feedback. Clique aqui para efetuar o login
Ajude-nos a evoluir: você gostou do post?  (11)  (0)
Confirmar voto
Compartilhe:
Ficou com alguma dúvida?