如何用更简洁方式替代switch-case实现PacMan游戏地图符号转图片？

核心优化思路：用映射对象替代冗长的switch-case #

把地图符号与对应资源/逻辑的对应关系集中存储在一个映射结构中，遍历地图时直接通过符号匹配处理逻辑，彻底消除重复代码块。

基础优化方案（针对符号仅对应图片的场景） #

先定义符号与图片路径的映射表，后续新增符号只需在此添加键值对：

// 符号-图片路径映射表，所有符号对应关系统一管理
const symbolImageMap = {
  'a': '../javascript/images/board/boundaryHorizontal.png',
  'b': '../javascript/images/board/boundaryVertikal.png',
  // 新增符号直接加在这里，比如 'c': '../xxx/xxx.png'
};

function createImage(src) {
  const image = new Image()
  image.src = src
  return image
}

// 简化后的地图遍历逻辑
map.forEach((row, zeilen) => {
  row.forEach((symbol, spalten) => {
    // 若当前符号无对应配置，直接跳过
    const imagePath = symbolImageMap[symbol];
    if (!imagePath) return;

    boundaries.push(
      new Boundary({
        position: {
          x: Boundary.width * spalten,
          y: Boundary.height * zeilen
        },
        image: createImage(imagePath)
      })
    );
  });
});

进阶优化方案（支持不同符号对应不同逻辑） #

如果后续需要处理不同类型元素（比如PacMan、道具、敌人），可以把映射表的值改为处理函数，扩展性更强：

// 符号-处理函数映射表，每个符号对应独立的生成逻辑
const symbolHandlers = {
  'a': (spalten, zeilen) => {
    boundaries.push(new Boundary({
      position: { x: Boundary.width * spalten, y: Boundary.height * zeilen },
      image: createImage('../javascript/images/board/boundaryHorizontal.png')
    }));
  },
  'b': (spalten, zeilen) => {
    boundaries.push(new Boundary({
      position: { x: Boundary.width * spalten, y: Boundary.height * zeilen },
      image: createImage('../javascript/images/board/boundaryVertikal.png')
    }));
  },
  'p': (spalten, zeilen) => {
    // 示例：生成PacMan角色
    pacman = new Pacman({
      position: {
        x: Boundary.width * spalten,
        y: Boundary.height * zeilen
      }
    });
  }
  // 新增元素直接添加对应的处理函数即可
};

function createImage(src) {
  const image = new Image()
  image.src = src
  return image
}

// 统一遍历执行对应逻辑
map.forEach((row, zeilen) => {
  row.forEach((symbol, spalten) => {
    const handler = symbolHandlers[symbol];
    if (handler) handler(spalten, zeilen);
  });
});

优化后的优势 #

• 代码量大幅减少：原来200+行的switch-case会压缩到几十行，维护成本骤降
• 扩展性极强：新增关卡或符号只需修改映射表，无需改动遍历核心逻辑
• 可读性提升：所有符号的对应关系一目了然，无需在大量case块中查找

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