"Se um trabalhador quiser fazer bem o seu trabalho, ele deve primeiro afiar suas ferramentas." - Confúcio, "Os Analectos de Confúcio. Lu Linggong"
Primeira página > Programação > Usos flexíveis do AND lógico (&&) e OR (||) em JavaScript

Usos flexíveis do AND lógico (&&) e OR (||) em JavaScript

Publicado em 2024-11-04
Navegar:125

Flexible Uses of the Logical AND (&&) and OR (||) in JavaScript

Introdução

Os valores booleanos são absolutos, verdadeiros ou falsos. Isso é o mais claro possível. Outros tipos de dados em JavaScript também têm esses valores inerentes de verdadeiro e falso, mas não é tão óbvio porque se parecem com 32, nulo, 0 e ‘Hello’ em vez de verdadeiro e falso. Saber que todos os valores possuem esses valores inerentes significa que podemos realizar operações em todos os tipos de dados normalmente usados ​​para booleanos. Isso nos proporciona mais criatividade e flexibilidade durante a codificação.

Compreendendo valores verdadeiros e falsos

Ao trabalhar com palavras-chave de fluxo de controle como if e operadores lógicos como AND (&&) e OR (||), usamos booleanos para obter determinados resultados. Esses booleanos podem ser usados ​​explicitamente com verdadeiro ou falso, mas geralmente os geramos com operadores de comparação como ===, .

O que acontece se não usarmos um booleano com fluxo de controle ou operadores lógicos? Bem, você está com sorte! Todos os valores são inerentemente verdadeiros ou falsos para ajudar nisso. Podemos categorizar todos os valores em duas categorias: verdadeiro ou falso.

Ao tentar descobrir se um valor é verdadeiro ou falso, é melhor lembrar os valores falsos, pois há apenas uma quantidade limitada deles:

  • falso (um valor booleano)
  • nulo
  • indefinido
  • NaN (não é um número)
  • 0 (um valor numérico)
  • "" (o valor da string vazia)

Todo o resto é verdade. Se você não tiver certeza se algo é verdadeiro ou falso ou se se deparar com uma situação única que parece ambígua, você sempre pode criar uma instrução if para ver se o código dentro do bloco de código a seguir é executado.

if (23) { console.log(“truthy”); } // Prints “truthy”
else { console.log(“falsy”); }

if (null) { console.log(“truthy”); } 
else { console.log(“falsy”); } // Prints “falsy”

E lógico (&&)

Ao usar booleanos com AND lógico (&&), ambos os valores precisam ser verdadeiros para que o operador lógico retorne verdadeiro. Caso contrário, se pelo menos um valor for falso, ele retornará falso.

console.log(false && false); // false
console.log(true && false); // false
console.log(true && true); // true

Compreender a mecânica do operador lógico AND (&&) pode ajudá-lo quando se trata de valores verdadeiros e falsos. Se o valor à esquerda for falso, retorne-o; caso contrário, retorne o valor à direita.

console.log(0 && 1); // 0
console.log("a" && ""); // "" (an empty string)
console.log([] && [1, 2, 3]); // [1, 2, 3]

O operador lógico AND (&&) deseja retornar um valor falso e só retorna o valor verdadeiro à direita se ambos forem verdadeiros. Você pode pensar nos dois argumentos assim:

(Lado Esquerdo) Use-me apenas se eu for um valor falso. && (lado direito) Caso contrário, use-me.

OU lógico (||)

Ao usar booleanos com OR lógico (||), ambos os valores precisam ser falsos para que o operador lógico retorne falso. Caso contrário, se pelo menos um valor for verdadeiro, ele retornará verdadeiro.

console.log(false || false); // false
console.log(true || false); // true
console.log(true || true); // true

Veja como funciona o operador lógico OR (||): se o valor à esquerda for verdadeiro, retorne-o; caso contrário, retorne o valor à direita.

console.log(1 || 0); // 1
console.log("" || "a"); // "a"
console.log(undefined || null); // null
console.log([] || [1, 2, 3]); // []

O operador lógico OR (||) deseja retornar um valor verdadeiro e só retorna o valor falso à direita se ambos forem falsos. Você pode pensar nos dois argumentos assim:

(Lado Esquerdo) Só me use se eu for um valor verdadeiro. || (Lado direito) Caso contrário, use-me.

Usos criativos de AND (&&) e OR (||)

Usando um valor padrão ao esperar uma entrada

Digamos que você esteja criando um objeto que representa uma pessoa que vem com propriedades que descrevem a pessoa junto com uma função que cumprimenta outras pessoas usando as outras propriedades do objeto.

function Person(name) {
    // If name is undefined, this.name will 
    // default to 'a person with no name'
    this.name = name || 'a person with no name';
    this.greet = function() {
        console.log('Hello, I am '   this.name   '.');
    };
}

// Create Person variables
var tyler = new Person('Tyler');
var mystery = new Person(); 
// Without an input, this.name defaults to the 
// second option since name is undefined.

// Call greet() from each Person object
tyler.greet(); // "Hello, I am Tyler."
mystery.greet(); // "Hello, I am a person with no name."

No exemplo acima, esperávamos uma entrada para o parâmetro name, então o segundo valor na operação OR (||) só é usado se o nome for indefinido (sem argumento na chamada da função).

Exigindo múltiplas entradas

Se você estiver criando objetos e quiser ter certeza de ter um número definido de entradas antes de criar o objeto, você pode encadear operadores lógicos AND (&&) em cada parâmetro necessário.

function Person(firstName, lastName, age) {
  if (firstName && lastName && age) {
    this.firstName = firstName;
    this.lastName = lastName;
    this.fullName = `${this.firstName} ${this.lastName}`;
    this.age = age;
    this.greet = function() {
      console.log(`Hello, my name is ${this.fullName} and I'm ${this.age} years old.`);
    };
  } 

  // If any argument is missing, the object will only have this property.
  else {
    this.greet = function() {
      console.log(`Hello, I am not a fully formed Person.`)
    };
  }
}

var tyler = new Person('Tyler', 'Meyer', 32);
var brad = new Person('Brad', '', 38);

tyler.greet(); // "Hello, my name is Tyler Meyer and I'm 32 years old."
brad.greet(); // "Hello, I am not a fully formed Person."

A instrução if está verificando um argumento para cada parâmetro antes de criar o objeto Person completo. Se pelo menos um argumento for um valor falso, ele criará um objeto com a instrução else. Portanto, podemos evitar objetos incompletos ou criar objetos padrão para entradas incompletas.

Conclusão

Se você precisar de um valor padrão até que um valor seja fornecido, o operador lógico OR (||) pode ser muito útil. Se você precisar exigir vários valores antes de continuar, o operador lógico AND (&&) pode ser muito útil. Estes são apenas dois exemplos e, à medida que você continua a explorar esses operadores, descobrirá que há muitas outras maneiras de usar esses operadores fora da verificação usual de valores booleanos verdadeiros ou falsos. Tenha essas duas coisas em mente ao usar os lógicos AND (&&) e OR (||):

  • OR (||) : Use apenas o valor à esquerda se for verdadeiro.
  • AND (&&) : Use apenas o valor à esquerda se for falsy.

Se você tiver alguma dúvida, deixe nos comentários. Ficarei feliz em discutir mais este tópico.

Boa codificação!

Declaração de lançamento Este artigo é reproduzido em: https://dev.to/tymey/flexible-uses-of-the-logical-and-and-or-in-javascript-1c6o?1 Se houver alguma violação, entre em contato com [email protected] para excluí-lo.
Tutorial mais recente Mais>

Isenção de responsabilidade: Todos os recursos fornecidos são parcialmente provenientes da Internet. Se houver qualquer violação de seus direitos autorais ou outros direitos e interesses, explique os motivos detalhados e forneça prova de direitos autorais ou direitos e interesses e envie-a para o e-mail: [email protected]. Nós cuidaremos disso para você o mais rápido possível.

Copyright© 2022 湘ICP备2022001581号-3