function test(feup) {
  switch (feup) {
    case '妲己':
      return ['法師', '控'];
    case '魯班':
      return ['射手', '腿短'];
    case '安其拉':
      return ['法師', '喜歡讀魔法書'];
    case '前端指北':
      return ['成長', '進階','面試題'];
    default:
      return ['starkwang'];
  }
}

//test results
test(null); // ['starkwang']
test('安其拉'); // ['法師', '喜歡讀書']

image

上面的代碼看起來沒什么問題，但是我發現它相當冗長。同樣的結果也可以通過使用更清晰的 object literal 來實現:

const hero = {
  daji: ['法師', '控'],
  luban: ['射手', '腿短'],
  anqila: ['法師', '喜歡讀魔法書'],
  qianduanzhibei:['成長', '進階','面試題']
};

function test(feup) {
  return hero[feup] || [];
}

image

或者，你也可以使用 Map 來達到同樣的結果:

  const hero = new Map()
    .set('daji', ['法師', '控'])
    .set('luban', ['射手', '腿短'])
    .set('anqila',  ['法師', '喜歡讀魔法書'])
    .set('qianduanzhibei', ['成長', '進階','面試題'])

function test(color) {
  return hero.get(color) || [];
}

image

Map詳細知識了解可以去這了解：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

Map 是自 ES2015以來可用的對象類型，允許您存儲鍵值對。

我們應該禁止 switch 語句的使用嗎？不要把自己局限于此。就我個人而言，只要有可能，我就會使用 object literal，但我不會設置硬性規則來阻止它，而是使用任何對您的場景有意義的方法。

對于上面的例子，我們實際上可以通過重構代碼來使用 Array.filter 實現相同的結果。

const hero = [
    { name: 'daji', ability: '法師' },
    { name: 'luban', ability: '射手' },
    { name: 'anqila', ability: '喜歡讀魔法書' },
    { name: 'qianduanzhibei', ability: '成長' }
];

function test(ability) {
  return hero.filter(f => f.ability == ability);
}

image

總有不止一種方法可以達到同樣的結果，當寫代碼的時候，我們要思考怎么用更優雅的方式來表達，這樣當別人review代碼的時候，會體現出自己的水平。