Abandone o switch em Javascript

Abandone o switch em Javascript

Dica rápida galera.

Imagina que você tem um série de else ifs então o que você faz?

switch(fruta) {
  case: '🍊';
    cestaDeFrutas = 🍊;
    break;
  case: '🍎'
	cestaDeFrutas = 🍎;
    break;
}

Só que isso em Javascript pode ser escrito de outra forma

const frutas = {
  🍎: 🍎
  🍊: 🍊,
}

cestaDeFrutas = frutas[fruta];

Dessa forma você elimina um monte de código e repetição e deixa o loop interno agir.

Sempre que você ver um switch case em javascript, olhe bem para ele crie um mapeamento.

Para reforçar segue um exemplo de código retirado do Github.

function SwitchTest(value){
  const result = 0;
  
  switch(value) {
    case 0:
      result += 2;
    case 1:
      result += 4;
      break;
    case 2:
      result += 8;
    case 3:
      result += 16;
    default:
      result += 32;
      break;
    case 4:
      result += 64;
  }
  
  return result;
}
function SwitchTest(value) {
  const result = {
    0: 2,
    1: 4,
    2: 8,
    3: 16,
    4: 64,
  };
  
  return result[value] || 32;
}

Com esse switch mais longo deu até para entender a vantagem né?

UPDATE 04/05/2020 - Dica de perfomance

Hoje lendo um artigo vi algo interessante e que performa melhor do que o descrito acima, mas preciso fazer um comentário que ele pode não se aplicar em todos os cenários, principalmentes naqueles com ES5.

A sugestão envolve usar o um map ao invés de switch

const m = new Map([
    ['segunda','dia útil'],
    ['terca', 'dia útil'],
    ['quarta', 'dia útil'],
    ['quinta', 'dia útil'],
    ['sexta', 'dia útil'],
    ['sabado', 'final de semana'],
    ['domingo', 'final de semana']
]);

return m.get(day);

E se quiser consultar os detalhes dessa sugestões, pode dar uma olhada aqui.


Já sabem né? Dúvidas, criticas e sugestões, só me procurar no Twitter ou abrir a issue no repo do blog.