我們經(jīng)常需要根據(jù)不同的條件執(zhí)行不同的邏輯，傳統(tǒng)上，if-else 和 switch 語句是處理這類場(chǎng)景的常用方式。然而，隨著現(xiàn)代 JavaScript 的發(fā)展，出現(xiàn)了更優(yōu)雅、更簡(jiǎn)潔的替代方案：對(duì)象映射（Object Literal）和 Map 數(shù)據(jù)結(jié)構(gòu)。

傳統(tǒng) switch 語句的問題

首先，讓我們看看傳統(tǒng) switch 語句的典型用法：

這種寫法存在幾個(gè)問題：

• 冗長(zhǎng)且重復(fù) - 每個(gè) case 都需要寫 case 關(guān)鍵字和 return 或 break 語句
• 容易出錯(cuò) - 忘記 break 語句會(huì)導(dǎo)致意外的 fall-through 行為
• 難以維護(hù) - 添加或修改分支時(shí)，需要在大塊代碼中仔細(xì)添加
• 可讀性較差 - 尤其當(dāng)每個(gè) case 分支包含較多邏輯時(shí)

使用對(duì)象映射(Object Literal)替代 switch

對(duì)象映射是替代簡(jiǎn)單 switch 語句的最直接方式：

處理復(fù)雜邏輯

如果每個(gè)分支包含更復(fù)雜的邏輯，可以將函數(shù)作為對(duì)象的值：

使用 Map 數(shù)據(jù)結(jié)構(gòu)

ES6 引入的 Map 數(shù)據(jù)結(jié)構(gòu)提供了比對(duì)象字面量更強(qiáng)大的功能，特別適合以下場(chǎng)景：

• 鍵不限于字符串，可以是任何類型（包括對(duì)象、函數(shù)等）
• 需要頻繁添加/刪除鍵值對(duì)
• 需要保持插入順序
• 需要直接獲取映射的大小

用法示例

函數(shù)映射和鏈?zhǔn)讲僮?/h4>

Map 非常適合實(shí)現(xiàn)命令模式或策略模式：

classCalculator {
  constructor() {
    this.operations = newMap([
      ['+', (a, b) => a + b],
      ['-', (a, b) => a - b],
      ['*', (a, b) => a * b],
      ['/', (a, b) => a / b],
      ['%', (a, b) => a % b],
      ['', (a, b) => a  b]
    ]);
  }
  calculate(a, operator, b) {
    const operation = this.operations.get(operator);
    if (!operation) {
      throw new Error(`Unsupported operator: ${operator}`);
    }
    return operation(a, b);
  }
  // 擴(kuò)展計(jì)算器功能
  addOperation(operator, fn) {
    this.operations.set(operator, fn);
      return this; // 支持鏈?zhǔn)秸{(diào)用
    }
  }

const calc = new Calculator()
  .addOperation('log', (a, b) =>Math.log(a) / Math.log(b));

console.log(calc.calculate(10, '+', 5)); // 15
console.log(calc.calculate(10, 'log', 10)); // 1

現(xiàn)代 JavaScript 為我們提供了多種工具來改進(jìn)代碼質(zhì)量，擁抱對(duì)象映射和 Map，可以讓我們編寫出更優(yōu)雅、更易維護(hù)的代碼。