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

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

image

上面的代碼看起來(lái)沒(méi)什么問(wèn)題，但是我發(fā)現(xiàn)它相當(dāng)冗長(zhǎng)。同樣的結(jié)果也可以通過(guò)使用更清晰的 object literal 來(lái)實(shí)現(xiàn):

const hero = {
  daji: ['法師', '控'],
  luban: ['射手', '腿短'],
  anqila: ['法師', '喜歡讀魔法書(shū)'],
  qianduanzhibei:['成長(zhǎng)', '進(jìn)階','面試題']
};

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

image

或者，你也可以使用 Map 來(lái)達(dá)到同樣的結(jié)果:

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

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

image

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

Map 是自 ES2015以來(lái)可用的對(duì)象類(lèi)型，允許您存儲(chǔ)鍵值對(duì)。

我們應(yīng)該禁止 switch 語(yǔ)句的使用嗎？不要把自己局限于此。就我個(gè)人而言，只要有可能，我就會(huì)使用 object literal，但我不會(huì)設(shè)置硬性規(guī)則來(lái)阻止它，而是使用任何對(duì)您的場(chǎng)景有意義的方法。

對(duì)于上面的例子，我們實(shí)際上可以通過(guò)重構(gòu)代碼來(lái)使用 Array.filter 實(shí)現(xiàn)相同的結(jié)果。

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

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

image

總有不止一種方法可以達(dá)到同樣的結(jié)果，當(dāng)寫(xiě)代碼的時(shí)候，我們要思考怎么用更優(yōu)雅的方式來(lái)表達(dá)，這樣當(dāng)別人review代碼的時(shí)候，會(huì)體現(xiàn)出自己的水平。