0

Operadores if-else, switch-case, ternário e object literals

Francis Rodrigues
Francis Rodrigues

Olá, eu percebi que estudantes de Bootcamps enfrentam problemas com operadores lógicos que direcionam o fluxo de dados em algoritmos, então eu decidi colaborar com uma dica para ajudá-los a compreender esta resolução de problemas.


Brendan Eich, co-criador da Mozilla, também foi o criador do JavaScript, então considere a doc da Mozilla como seu dicionário oficial de programação em JavaScript (porém não é a única fonte).


Aqui vai uma explicação da própria Mozilla sobre o assunto.


MDN doc: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Operators/Conditional_Operator


O operador condicional ternário abaixo foi utilizado em um exercício específico, cujo o mesmo causou muita confusão nos estudantes.

resultado = (condicao) ? expressao_1 : expressao_2 ;


O operador acima espera satisfazer a condição e então retornar a expressão_1, senão retorna a expressão_2.


Instrução if…else


Essa mesma operação também pode ser feita com if-else:

if (condicao) {
  return faça_isso;
} else {
  return faça_aquilo;
}


Mas se os seus IFs e ELSEs ficarem gigantes no seu código, por respeitar boas práticas de desenvolvimento, vamos buscar outras maneiras de implementação.


MDN doc: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Statements/if...else



Instrução switch


Em outras circunstâncias, você pode usar o condicional switch para verificar os casos relacionados à sua condição.


MDN doc: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Statements/switch


OK, já aprendemos a usar o switch/case, mas ainda assim não estamos satisfeitos com o tempo de processamento e/ou a qualidade do nosso algoritmo, o que fazer?



Objeto literal / object literals


Reconheço que é uma prática avançada, porém RECOMENDO para a maioria dos casos de uso.


MDN doc: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Guide/Grammar_and_types#objeto_literal


Nada mais é que um objeto contendo diversas propriedades de chave-valor (key-value), e esta chave será o identificador do retorno do seu algoritmo dinâmico:

var carro = { carros: {a: "Saab", "b": "Jeep"}, 7: "Mazda" };

console.log(carro.carros.b); // Jeep
console.log(carro[7]); // Mazda


Nomes de propriedades de objeto podem ser qualquer string, inclusive vazia, mas caso não seja um identificador JavaScript ou número, deve ser colocado entre aspas:

var nomesPropriedadesIncomuns = {
  "": "Uma string vazia",
  "!": "Bang!"
}

console.log(unusualPropertyNames."");   // SyntaxError: string inesperada

console.log(unusualPropertyNames[""]);  // Um string vazia

console.log(unusualPropertyNames.!);    // SyntaxError: símbolo ! inesperado

console.log(unusualPropertyNames["!"]); // Bang!


Outro exemplo com um simples objeto literal que retorna apenas um valor String:

function getBebida (qual) {
  var bebidas = {
    'coke': 'Coca',
    'pepsi': 'Pepsi',
    'lemonade': 'Limonada',
    'default': 'Item padrão'
  };
  return 'Eu vou beber ' + (bebidas[qual] || bebidas['default']);
}


No exemplo acima eu vou dizer que eu prefiro uma bebida natural, logo:

var bebida = getBebida('lemonade');
console.log(bebida); // Eu vou beber Limonada


Ainda é possível simplificar e tornar ainda mais claro:

function getBebida (qual) {
  return 'Eu vou beber ' + {
    'coke': 'Coca',
    'pepsi': 'Pepsi',
    'lemonade': 'Limonada',
  }[qual];
}


Podemos precisar retornar algo mais complexo, não somente uma String, na qual pode ficar em uma função, sendo invocada (e carregada na memória) apenas quando necessário:

const qual = 'lemonade';

const bebidas = {
  'coke': () => 'Coca',
  'pepsi': () => 'Pepsi',
  'lemonade': () => 'Limonada'
};


A diferença é que precisamos chamar a função do Objeto Literal:

bebidas[qual]();


Simplificando, podemos adicionar um valor default, caso nenhum seja informado:

function getBebida(qual) {
  const bebidas = {
    'coke': () => 'Coca',
    'pepsi': () => 'Pepsi',
    'lemonade': () => 'Limonada',
    'default': () => 'Default item'
  };

  return (bebidas[qual] || bebidas['default'])();
}


Dessa forma a função encontra-se livre de responsabilidades em sua chamada, passando apenas o tipo da bebida para ser recuperada a informação.

var bebida = getBebida('lemonade');
console.log(bebida); // Eu vou beber Limonada


Resolução do exercício


No exercício proposto, você provavelmente vai implementar todos esses conceitos nessas duas linhas:

let dicionarioDeRegras = { ... }
(dicionarioDeRegras[opc1].includes(opc2)) ? opc1 : opc2;


Não vou entrar em mais detalhes sobre o exercício, respeitando o Código de Conduta da DIO.


Espero ter colaborado com o seu aprendizado hoje. :)

0
0

Comentários (1)

0
Afonso Simão

Afonso Simão

18/04/2021 19:43

Excelente artigo!

Parabéns.

Me ajudou imensamente!

Full Stack Developer | Tech Writer

Brasil