JavaScript自动完成结果存MySQL：替代switch语句的优化方案咨询

我编写了以下代码，用于获取用户选择的自动完成结果并将其存入MySQL数据库。当前通过switch语句逐个处理不同类型的选项，请问是否存在更高效的实现方式？

当前代码 #

select: function(event, ui) { 
  //alert(ui); 
  var selectedCase = false; 
  var selectedItem = ''; 
  var item = ui.item; 
  switch (item.type) { 
    case 'brands': 
      selectedCase = true; 
      selectedItem = base_url + 'brand/' + item.BrandUniqueName; 
      window.location.href = base_url + 'brand/' + item.BrandUniqueName; 
      break; 
    case 'categories': 
      selectedCase = true; 
      selectedItem = base_url + 'categories/' + item.CategoryUniquename; 
      window.location.href = base_url + 'categories/' + item.CategoryUniquename; 
      break; 
    case "categoryBrand": 
      selectedCase = true; 
      selectedItem = base_url + 'brand/' + item.BrandUniqueName + '? category = '+item.CategoryUniquename; 
      window.location.href = base_url + 'brand/' + item.BrandUniqueName + '? category = '+item.CategoryUniquename; 
      break; 
    case 'offercategory': 
      selectedCase = true; 
      selectedItem = base_url + 'offercategory/' + item.OfferCategory; 
      window.location.href = base_url + 'offercategory/' + item.OfferCategory; 
      break; 
    case 'vendorOfferCategory': 
      selectedCase = true; 
      selectedItem = base_url + 'offers/' + item.UniqueName + '? category = '+item.OfferCategory; 
      window.location.href = base_url + 'offers/' + item.UniqueName + '? category = '+item.OfferCategory; 
      break; 
    case 'vendor': 
      selectedCase = true; 
      selectedItem = base_url + 'offers/' + item.VendorUniqueName; 
      window.location.href = base_url + 'offers/' + item.VendorUniqueName; 
      break; 
    case 'offers': 
      selectedCase = true; 
      selectedItem = base_url + 'offers/' + item.UniqueName; 
      window.location.href = base_url + 'offers/' + item.UniqueName; 
      break; 
    case 'vendorcategory': 
      selectedCase = true; 
      selectedItem = base_url + 'topcategories/' + item.UniqueName; 
      window.location.href = base_url + 'topcategories/' + item.UniqueName; 
      break; 
    case 'vendors': 
      selectedCase = true; 
      selectedItem = base_url + 'offers/' + item.UniqueName; 
      window.location.href = base_url + 'offers/' + item.UniqueName; 
      break; 
    case 'products': 
      selectedCase = true; 
      selectedItem = base_url + 'products/' + item.InternalLink; 
      window.location.href = base_url + 'products/' + item.InternalLink; 
      break; 
    case "Not Available": 
      //$("#autocomplete").val(''); 
      break; 
  } 
  if (selectedCase == true) { 
    // alert(selectedItem); 
    var rslt = selectedItem; 
    this.saveResult(); 
  } 
  //$("#project-id").val(ui.item.email); 
  return false; 
}, 

当然有更简洁高效的实现方式！你可以用配置映射对象替代冗长的switch语句，这种方式不仅让代码更易读、易维护，后续新增类型时也只需要在映射对象里添加一条配置，不用修改核心逻辑代码。

优化思路 #

把每个item.type对应的URL规则、所需字段都定义在一个映射对象中，然后根据选中的类型直接从对象中获取配置，动态生成目标URL，避免重复的代码逻辑。

优化后的代码 #

首先定义路由配置映射：

// 提前定义好所有类型对应的路由规则
const routeMap = {
  brands: {
    pathTemplate: 'brand/{BrandUniqueName}'
  },
  categories: {
    pathTemplate: 'categories/{CategoryUniquename}'
  },
  categoryBrand: {
    pathTemplate: 'brand/{BrandUniqueName}?category={CategoryUniquename}'
  },
  offercategory: {
    pathTemplate: 'offercategory/{OfferCategory}'
  },
  vendorOfferCategory: {
    pathTemplate: 'offers/{UniqueName}?category={OfferCategory}'
  },
  vendor: {
    pathTemplate: 'offers/{VendorUniqueName}'
  },
  offers: {
    pathTemplate: 'offers/{UniqueName}'
  },
  vendorcategory: {
    pathTemplate: 'topcategories/{UniqueName}'
  },
  vendors: {
    pathTemplate: 'offers/{UniqueName}'
  },
  products: {
    pathTemplate: 'products/{InternalLink}'
  },
  "Not Available": {
    pathTemplate: ''
  }
};

然后修改select函数：

select: function(event, ui) {
  const item = ui.item;
  const routeConfig = routeMap[item.type];

  // 如果没有匹配到对应的配置，直接返回
  if (!routeConfig) return false;

  // 替换模板中的占位符为item对应的字段值
  const urlPath = routeConfig.pathTemplate.replace(/\{(\w+)\}/g, (match, fieldName) => {
    return item[fieldName] || '';
  });

  // 拼接完整URL
  const fullUrl = base_url + urlPath;

  // 处理跳转和保存逻辑（排除"Not Available"类型）
  if (item.type !== "Not Available") {
    window.location.href = fullUrl;
    this.saveResult();
  }

  return false;
},

优化后的优势 #

1. 可读性更强：所有路由规则集中在一个对象里，一眼就能看清每个类型对应的URL结构，不用在switch的各个case中来回查找
2. 维护成本更低：新增类型时，只需要在routeMap里添加一条配置即可，不需要修改函数的核心逻辑
3. 消除重复代码：避免了重复的window.location.href赋值和selectedItem变量操作
4. 扩展性更好：如果后续需要添加特殊逻辑（比如某些类型需要额外的参数处理），可以在配置对象中新增handler属性，专门处理特殊情况

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