Operadores Lógicos || e && do Javascript

Fala pessoal, tudo certo? Nesse artigo vamos falar um pouco sobre os operadores lógicos || e && no Javascript.

Eu costumo usar esses operadores com certa frequência como OR e AND. No caso, em uma comparação de dados o || é o OR e o && é o And.

Assim sendo, veja essa comparação de duas condições no mesmo if: 

if(1==1 || 1==2){

  console.log("Uma das condições é Verdadeira");

}

Nesse caso, usando o operador ||, caso a primeira condição seja verdadeira (true) a segunda nem é avaliada. Pois não importa se a segunda condição seja falsa, uma vez que a primeira já é verdadeira. A segunda comparação só é avaliada quando a primeira é falsa. 

O operador && funciona de forma oposta. Caso a primeira condição seja falsa a segunda condição nem é avaliada. Pois havendo uma delas falsa é o que importa para que seja retornado o valor false na comparação binária. 

Curiosidades sobre os Operadores || e &&

Agora, note que os operadores && e || podem ser usados fora do IF, e inclusive sem o operador de igual (==). Veja o exemplo: 

console.log(1==2 || "legal");

Isso fará ser impresso no console a string “legal”. Ora, aqui foi usado o operador ||, que avaliou a primeira comparação (1==2) como false e então retornou a segunda, onde há somente a string “legal”. 

Agora, curiosamente, se você fizer isso: 

console.log("oi" || "vida");

No console será impresso “oi”. Até aqui tudo intuitivo, pois a string “oi” foi interpretada/convertida para true e então retornada.  Diz a regra que qualquer string que não esteja vazia “” sempre será considerada true numa comparação de verdadeiro ou falso. 

Porém, se você fizer isso aqui: 

console.log("oi"==true || "vida");

No console será impresso “vida”. Curioso, não? Porém, se você usar Boolean para converter a string para true ou false antes de comparar com ==, o resultado muda. Veja: 

console.log(Boolean("oi")==true || "vida");

Isso fará ser impresso true no console. 

E usando o &&, ficaria assim: 

console.log(Boolean("oi")==true && "vida");

Isso fará ser impresso “vida” no console. 

Conclusão

Bom, em suma temos que usando o operador || o Javascript tenta comparar o primeiro valor ou condição com true. Então temos:

a) Caso essa comparação seja verdadeira é retornado esse primeiro valor ou true (caso seja uma comparação). Nesse caso o segundo valor ou comparação é totalmente desconsiderado.

b) Caso essa comparação seja falsa, então é retornado o segundo valor ou o resultado da comparação (seja true ou false).

Já para o operador && o Javascript tenta comparar o primeiro valor ou comparação como false. E então temos:

a) Caso o primeiro valor seja igual a false, esse valor é retornado, ou o próprio false caso seja uma comparação. Nesse caso, o segundo valor ou comparação é totalmente desconsiderado.

b) Caso o primeiro valor seja igual a verdadeiro, então retorna-se o segundo valor ou o resultado da comparação, caso o segundo valor seja uma comparação.

Bom, espero que tenha ficado claro, qualquer dúvida deixe aqui nos comentários.

Abraços e até um próximo artigo!

Na próxima semana farei mais um review com depoimento e resenha sobre Operadores Lógicos || e && do Javascript.

Espero ter ajudado a esclarecer o que é, como usar, se funciona e se vale a pena mesmo Operadores Lógicos || e && do Javascript. Se você tiver alguma dúvida ou quiser adicionar algum comentário deixe abaixo.