Reduzindo a quantidade de IFs com JS

Marcos Sanches•04/28/2023

2 min

Bom, depois de aprender os conceitos básicos de programação, if/else, loops, funções e tratamento de objetos, é normal que o desenvolvedor comece a se preocupar com a qualidade de seu código, e se esse é o seu caso, parabéns!

Uma das coisas que mais dificulta o entendimento de um código, é uma quantidade enorme de if/elses, mas afinal, como aplicar as regras de negócio diminuindo a quantidade de condições?

Uma das ferramentas que é nossa aliada nesse tipo de situação é um design pattern chamado "Strategy", que é um padrão de desenvolvimento que facilita o entendimento e a escrita do nosso código.

"Tudo bem, mas como eu aplico?"
Que bom que perguntou!

Imagine que você está desenvolvendo uma função de calcular números, e você escreve a função abaixo:


          
            function calculate(number,operation){
          
          
              if(operation == 'add 2'){
          
          
                console.log('Result:'+ (number+2))
          
          
              }else if(operation == 'subtract 2'){
          
          
                console.log('Result:'+ (number-2))
          
          
              }else if(operation == 'multiply by 2'){
          
          
                console.log('Result:'+ (number*2))
          
          
              }else if(operation == 'divide by 2'){
          
          
                console.log('Result:'+ (number/2))
          
          
              }
          
          
            } 
          
          
            
          
          
            calculate(4,'add 2');

Se rodarmos essa função acima ela funcionará normalmente, mas perceba como nossa função fica enorme, para reduzir a complexidade e facilitar a leitura do código que entra o Strategy.

Como resolver?

Para resolver esse problema usaremos objetos!


          
            const calculator = {
          
          
              'add 2': number => console.log('Result: '+ (number+2)),
          
          
              'subtract 2': number => console.log('Result: '+ (number-2)),
          
          
              'divide by 2': number => console.log('Result: '+ (number/2)),
          
          
              'multiply by 2': number => console.log('Result: '+ (number*2)),
          
          
            }
          
          
            
          
          
            function calculate(number,operation){
          
          
              return calculator[operation](number)
          
          
            }
          
          
            
          
          
            calculate(5,'add 2')

Percebe que dessa forma, ao invés de fazermos uma checagem if a if, apenas passamos o nome do objeto e o nome da propriedade? Dessa forma o código fica mais fácil de ler e de dar manutenção.

"Código bom, é código fácil de dar manutenção."

Learn

Support

More Options