如何优化JavaScript/TypeScript中的嵌套if-else为switch或更可读写法？

问题背景 #

我最初尝试用switch语句实现业务逻辑，但发现switch的case不能使用布尔表达式（比如case countries.includes('France')不符合语法），于是改用嵌套if-else实现，但代码层级深、扩展性差。

现有两个数组：

const countries = [ 'France', 'Italy', 'Spain' ];
const cities = [ 'Paris', 'Marseille', 'Rome', 'Naples', 'Milan', 'Madrid' ];

关联规则与业务逻辑 #

• 国家与城市对应关系：
  • France → Paris、Marseille
  • Italy → Rome、Naples、Milan
  • Spain → Madrid
• 执行逻辑：
  1. 按字母顺序（France > Italy > Spain）优先检查传入的国家数组
  2. 若匹配到国家但传入的城市数组为空，默认使用对应国家的首都（对应列表第一个城市）
  3. 若有多个可选城市，优先选择对应列表中最后一个在传入城市数组里存在的城市

示例 #

• 输入：countries = [ 'France' ]; cities = [ 'Marseille'] → 输出：doThat('Marseille');
• 输入：countries = [ 'France' ]; cities = [] → 输出：doThat('Paris');
• 输入：countries = [ 'France' ]; cities = [ 'Paris', 'Marseille'] → 输出：doThat('Marseille');

原实现代码 #

const doThat = (city: string) => {
  console.log(city);
};

const myFunc = (countries: string[], cities: string[]) => {
  if (countries.includes('France')) {
    if (cities.includes('Marseille')) {
      doThat('Marseille');
    } else doThat('Paris');
  } else if (countries.includes('Italy')) {
    if (cities.includes('Naples')) {
      doThat('Naples');
    } else if (cities.includes('Milan')) {
      doThat('Naples');
    } else doThat('Rome');
  } else if (countries.includes('Spain')) {
    doThat('Madrid');
  } else doThat('empty');
};

优化方案：用配置对象解耦规则与逻辑 #

核心思路是把国家的关联规则、优先级等数据从逻辑代码中抽离，用配置对象统一管理，让逻辑代码更通用、易维护。

步骤1：定义统一配置 #

按国家检查顺序，把每个国家的城市优先级（从低到高）、首都信息整理成配置数组：

// 配置数组：按检查顺序排列，每个项包含国家名、城市优先级列表、首都
const countryConfigs = [
  {
    name: 'France',
    cityPriority: ['Paris', 'Marseille'], // 优先级：Marseille > Paris
    capital: 'Paris'
  },
  {
    name: 'Italy',
    cityPriority: ['Rome', 'Milan', 'Naples'], // 优先级：Naples > Milan > Rome
    capital: 'Rome'
  },
  {
    name: 'Spain',
    cityPriority: ['Madrid'],
    capital: 'Madrid'
  }
];

注：如果要保留原代码中Italy的特殊逻辑（只要存在Milan就返回Naples），可将Italy的配置改为：

{
  name: 'Italy',
  priorityCity: 'Naples',
  triggerCities: ['Naples', 'Milan'], // 只要存在这些城市中的任意一个，就返回priorityCity
  capital: 'Rome'
}

后续逻辑对应调整即可。

步骤2：编写通用逻辑 #

遍历配置数组找到第一个匹配的国家，再根据配置筛选目标城市：

const doThat = (city: string) => {
  console.log(city);
};

const myFunc = (countries: string[], cities: string[]) => {
  // 找到第一个符合条件的国家（按配置顺序）
  const matchedCountry = countryConfigs.find(config => countries.includes(config.name));
  
  if (!matchedCountry) {
    doThat('empty');
    return;
  }

  // 筛选出传入城市数组中存在的当前国家城市
  const availableCities = matchedCountry.cityPriority.filter(city => cities.includes(city));
  
  // 取最高优先级城市（数组最后一项），无匹配则用首都
  const targetCity = availableCities.length > 0 ? availableCities.at(-1)! : matchedCountry.capital;
  
  doThat(targetCity);
};

优化后的优势 #

1. 可读性提升：规则集中在配置对象，逻辑与数据分离，一眼就能看懂每个国家的优先级设置
2. 扩展性增强：新增国家或修改城市规则时，只需修改配置数组，无需改动核心逻辑
3. 代码更简洁：去掉多层嵌套if-else，逻辑线性化，降低维护成本

内容的提问来源于stack exchange，提问作者Leo Messi