Dev fast tips | #0 – Operadores ternários

Fala galera! Espero que esteja tudo certo com vocês!

Vou iniciar uma série, chamada “Dev fast tips”, onde vou dar algumas dicas rápidas e bastante úteis em nosso dia-a-dia. Hoje vou começar falando sobre operadores ternários; um assunto bastante simples, porém ainda vejo que bastante gente não conhece, não usa, ou tem dificuldade para usar. Bora lá?

Mas afinal, o que é um operador ternário?

O operador ternário é um cara bastante simples e serve basicamente para validar uma operação “if / else” que vai retornar um valor booleano (true ou false).

O nome “ternário” vem do fato de o operador possuir três partes, que são separadas pelos caracteres “?” e “:“, como no exemplo abaixo:

algumaCondicao ? valorCasoSejaVerdadeira : valorCasoSejaFalsa;

Isso pode substituir por exemplo, uma condição de if / else parecida com essa:

if(algumaCondicao)
return valorCasoSejaVerdadeira;
else
return valorCasoSejaFalsa;

view raw
if-else.js
hosted with ❤ by GitHub

Olha só quantas linhas nós economizamos! 😀

Legal, entendi! Quero mais exemplos!

Estou utilizando JavaScript para realizar os exemplos, pois é uma linguagem deveras dinâmica, onde podemos considerar que zero, null, undefined, NaN e acreditem, inclusive o próprio false, podem assumir o valor “false“. Como vocês podem ver a seguir:

let a = new Boolean([].length);
let b = new Boolean(0);
let c = new Boolean(false);
let d = new Boolean(null);
let e = new Boolean(undefined);
let f = new Boolean(NaN);
console.log(a, b, c, d, e, f);
//[Boolean: false] [Boolean: false] [Boolean: false] [Boolean: false] [Boolean: false] [Boolean: false]

view raw
booleans.js
hosted with ❤ by GitHub

Podemos simplificar por exemplo a situação a seguir, onde preciso verificar se tem itens em uma lista:

let listaQualquer = [
'Item 001',
'Item 002',
'Item 003',
'Item 004'
];
let temCoisas;
if (listaQualquer.length > 0)
temCoisas = true;
else
temCoisas = false;

view raw
if-else-lista.js
hosted with ❤ by GitHub

Podemos utilizar o operador ternário para fazer o seguinte:

let listaQualquer = [
'Item 001',
'Item 002',
'Item 003',
'Item 004'
];
let temCoisas = listaQualquer.length > 0 ? true : false;

view raw
ternario1.js
hosted with ❤ by GitHub

Já diminuímos o código para apenas 1 linha, e vejam só, podemos deixá-lo ainda mais elegante, e de várias formas diferentes:

let listaQualquer = [
'Item 001',
'Item 002',
'Item 003',
'Item 004'
];
//Atual
let temCoisas = listaQualquer.length > 0 ? true : false;
//Como o resultado disso retorna 'true' ou 'false' e é isso que eu preciso…
//Nesse caso, utilizar o operador ternário não é necessário 🙂
let temCoisas = listaQualquer.length > 0;
//Ou melhor ainda…
//Lembram que o JS pode assumir o Zero como false?
//Então qualquer número diferente disso, é true!
//Se não tiver nada (zero) o temCoisas pode assumir 'false'
//E se tiver, vai assumir 'true'
let temCoisas = listaQualquer.length;

view raw
ternario2.js
hosted with ❤ by GitHub

Simples né?

Espero que tenham gostado, e para os que ainda não utilizam, que comecem a desfrutar das vantagens do operador ternário e da magia do JavaScript rsrs.

Caso tenham alguma sugestão de dicas rápidas, mandem por favor! Vou adorar recebê-las!

Por hoje é só, qualquer dúvida ou sugestão, estou à disposição! Até mais 😀

Deixe uma Resposta

Preencha os seus detalhes abaixo ou clique num ícone para iniciar sessão:

Logótipo da WordPress.com

Está a comentar usando a sua conta WordPress.com Terminar Sessão /  Alterar )

Google photo

Está a comentar usando a sua conta Google Terminar Sessão /  Alterar )

Imagem do Twitter

Está a comentar usando a sua conta Twitter Terminar Sessão /  Alterar )

Facebook photo

Está a comentar usando a sua conta Facebook Terminar Sessão /  Alterar )

Connecting to %s