JavaScript: Como funciona o if e else ternário (? e :)

Neste artigo veremos como funciona o if e else ternário no JavaScript, que são famosos por seus símbolos ? e :, e também como aplicar este operador.

Fala programdor(a), beleza? Neste artigo veremos como funciona o if/else ternário do JavaScript.

Para começar, este operador representa uma estrutura de if e else normal do JavaScript de forma resumida

Ou seja, não há diferença entre as abordagens, além da clarificação do código utilizando a forma maior e mais comum

O if e else ternário, pode ser divido nas seguintes partes:

condição ? valor se verdadeiro : valor se falso

A condição seria o que vamos comparar para o if determinar se é falso ou verdadeiro

Quer se especializar em Desenvolvimento Web? Veja o nosso catálogo de cursos.

No if normal, esta parte fica entre parentes, no ternário não há esta necessidade

Depois o ponto de interrogação funciona como uma pergunta “é verdadeiro?” e caso for, entre na condição seguinte dele executando aquela lógica

Já os dois pontos (:) representa um ‘se for falso’, e caso seja, executa aquela lógica em seguida dele

Então vamos fazer uma comparação:

// if comum
if(1 == 2) {
    console.log('verdadeiro');
} else {
    console.log('falso');
}

// if ternário
1 == 2 ? console.log('veradeiro') : console.log('falso');

A mesma comparação escrita das duas formas, perceba que a execução de ‘falso’ será dada nas duas estruturas

Uma vez que a primeira parte do if ternário representa a condição 1 do if comum, já a segunda parte representa o else

Perceba também que conforme a lógica vai ficando mais complicada, devemos escolher a abordagem comum

Pois o if ternário pode se tornar muito confuso, e em vez de facilitar nossa vida para escrever menos código

Deixar confuso ele, e nos gerar um problema de manutenibilidade

Uma boa ideia seria sempre utilizar a forma comum do if, caso você fique em duvida em qual utilizar

E nunca utilizar apenas para parecer que você sabe muito JavaScript ou deixar mais moderno seu código 😀

Utilize o if ternário em situações simples, a do exemplo é perfeita

Uma comparação bem pequena com respostas direta no código, sem muito mais lógica envolvida

Conclusão

Neste artigo a diferença entre o if comum e o ternário

E ainda como utilizar cada um deles, sendo que as duas formas podem ser utilizadas para o mesmo fim

A única diferença é a questão da leitura de código, que pode ser mais complicada na forma de if ternário

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube