Operadores Lógicos (Logical Operators) JavaScript

Nesse tutorial você vai aprender como usar os operadores lógicos. Veremos o operador NÃO (!), o operador E (&&) e o operador OU (||).

Ricardo Reis
7 min readMay 15, 2020

--

English version: https://www.javascripttutorial.net/javascript-logical-operators/

O JavaScript fornece três operadores lógicos

  • ! Operador lógico NÃO (Logical NOT)
  • || Operador lógico OU (Logical OR)
  • && Operador lógico E (Logical AND)

Os operadores lógicos são importantes no JavaScript porque permitem comparar variáveis e fazer algo com base no resultado dessa comparação.

Por exemplo, se o resultado da comparação for verdadeiro, você executa um bloco de código, se for falso, você executa outro bloco de código.

O operador lógico NÃO (Logical NOT)

JavaScript utiliza o ponto de exclamação ! para representar o operador lógico NÃO (negação ou valor contráio). O operador ! pode ser aplicado a um valor de qualquer tipo, não apenas a um valor booleano.

Quando você aplica o operador de negação ! a um valor booleano, o ! retorna true se o valor for false e retorna false se o valor for true, ou seja, vai retornar o valor contrário.

Por exemplo:

O resultado será:

Nesse exemplo, o eligible é true então !eligible retorna false (que é o contrário do seu valor original).

Podemos interpretar o código(!elegible) como se fosse seguinte pergunta: Qual é o contrário de elegible?

Como elegible é false, então o contrário será true.

O mesmo vale para a outra variável do exemplo required. Como required é true, o !require (contrário de require) é false.

Quando você aplica o operador ! para um valor que não é booleano, o operador ! primeiro converte o valor em um valor booleano (true ou false) e então negativa ele (torna ele o contrário). Por exemplo:

O operador lógico funciona com base nas seguintes regras:

  • Se a é undefined, o resultado é true.
  • Se a é null, o resultado é true.
  • Se a é um número diferente de0, o resultado é false.
  • Se a é NaN, o resultado é true.
  • Se a é um objeto, o resultado é false.
  • Se a é uma string vazia, o resultado é true. Caso a não for uma string vazia, o resultado é false.

O exemplo a seguir mostra o resultado do operador lógico ! quando aplicamos ele em um valor que não é booleano.

Negação dupla (!!)

As vezes você pode ver uma negação dupla !! em algum código, ela usa o operador lógico NÃO ! duas vezes para converter um valor em seu valor booleano real. O resultado é o mesmo que usar a função Boolean.

Por exemplo:

O primeiro operador ! retorna um valor booleano da variável counter e o segundo ! contradiz o resultado e acaba retornando o verdadeiro valor booleano da variável counter.

Operador Lógico E (&&)

O JavaScript usa dois "e comerciais" && para representar o operador lógico E (Logical AND operator).

A expressão a seguir usa o operador &&:

Se a puder ser convertido em true, o operador && vai retornar o valor de b , caso contrário ele retornará a. Essa regra é aplicada a valores booleanos.

A tabela a seguir ilustra o resultado do operador && quando aplicado a dois valores booleanos.

   a   |   b   |   a && b
-------+-------+----------

true | true | true
-------+-------+----------
true | false | false
-------+-------+----------
false | true | false
-------+-------+----------
false | false | false

O resultado do operador && será true apenas se ambos os valores forem true, caso contrário será sempre false. Por exemplo:

Nesse exemplo a variável elegible é false, portanto o valor da expressão elegible && required é false.

Veja outro exemplo:

Nesse exemplo ambas as variáveis elegible e required são true, portanto o valor da expressão elegible && required é true.

Avaliação de curto-circuito (Short-circuit evaluation)

O operador && está em curto-circuito. Isso significa que o operador && avalia o segundo valor apenas se o primeiro não for suficiente para determinar o valor de uma expressão. Por exemplo:

Resultado:

Nesse exemplo, b é true, então o operador && avalia a segunda expressão e retorna Infinity que é o resultado de (1/0).

Entretanto o exemplo:

Tem o seguinte resultado:

Nesse caso, b é false, portanto o operador && nem precisa verificar a segunda expressão, porque ele já consegue determinar o resultado final baseado no valor do primeiro operando (variável b).

Cadeia de operadores &&

A expressão a seguir usa múltiplos operadores &&:

O operador && executa o seguinte:

  • Avalia valores da esquerda para a direita.
  • Para cada avaliação, o valor é convertido em um booleano. Se o resultado for false então interrompe e retorna o valor original.
  • Se todos os valores forem true, será retornado o último valor.

Em outras palavras, o operador && retorna o primeiro valor falso ou o último verdadeiro.

Se um valor pode ser convertido em true, ele é chamado de um valor truthy (verdadeiro). Se um valor pode ser convertido em false, é denominado valor falsy (falso).

Operador Lógico OU ( || )

O JavaScript usa o pipe duplo || para representar o operador lógico OU (logical OR operator). Você pode aplicar o operador || para dois valores de qualquer tipo:

Se a pode ser convertido em true, então será retornado a, caso contrário, vai retornar b. Essa regra também se aplica a valores booleanos.

A tabela a seguir, ilustra o resultado do operador || com base no valor dos operandos (valores da esquerda e da direita):

   a   |   b   |  a || b
-------+-------+----------

true | true | true
-------+-------+----------
true | false | true
-------+-------+----------
false | true | true
-------+-------+----------
false | false | false

O operador || retornará false se ambos os valores avaliados forem false. Caso qualquer um dos valores seja true, o operador || retorna true. Por exemplo:

Nesse exemplo, a expressão (legible || required) retorna true porque um dos valores (nesse caso o elegible) é true. Veja outro exemplo:

Nesse caso a expressão (elegible || required) retorna false porque ambos são false.

O operador || também está em curto-circuito

Similar ao operador &&, o perador || também está em curto-circuito. Isso significa que, se o primeiro valor for avaliado como true, o opeador || não irá avaliar o segundo valor.

Cadeia de operadores ||

O exemplo a seguir mostra como usar vários operadores || em uma expressão:

O operador || faz o seguinte:

  • Avalia os valores da esquerda para a direita.
  • Para cada avaliação, converte o valor em booleano. Se o resultado da conversão for true, ele para e retorna o valor.
  • Se todos os valores tiverem sido avaliados como false, retornará o último valor.

Em outras palavras, a cadeia de operadores || retorna o primeiro valor de true ou o último se nenhum valor true for encontrado.

Precedência lógica do operador

Quando você usa diversos operadores lógicos em uma expressão, o motor JavaScript avalia os operadores com base em uma ordem específica e essa ordem é chamada precedência do operador. Em outras palavras, a precedência do operador é a ordem em que um operador é executado.

A precedência de execução dos operadores lógicos seguem a ordem (de cima para baixo) da lista a seguir:

  1. Operador lógico NÃO !
  2. Operador lógico E &&
  3. Operador lógico OU ||

Resumo:

  • O operador lógico NÃO !, nega um valor booleano. A negação dubla !!, converte um valor em seu valor booleano original.
  • O operador lógico E &&, é aplicado a dosi valores booleanos e retorna true se os dois valores forem true.
  • O operador lógico OU || é aplicado a dois valores booleanos e retorna true se pelo menos um dos valores for true.
  • Ambos os operadores && e || estão em "curto-circuito". Eles também podem ser aplicados a valores que não são booleanos.
  • A precedência lógica do operador da mais alta para a mais baixa é: !, && e ||.

Veja o índice de todos os tutoriais JavaScript

Confira uma série de outros tutoriais JavaScript que eu escrevi, clicando no link abaixo:

--

--