如何避免TabContainer不同标签页对应母版页功能的重复判断逻辑

问题背景 #

母版页包含Excel、PDF这类通用导出功能，内容页是带多标签页的TabContainer。触发导出时，母版页调用内容页的导出函数，需要根据当前激活的标签页执行不同导出逻辑（每个标签页导出字段不同）。现有实现用大量if-else判断标签页，功能正常但冗余度极高——新增导出类型（比如CSV）时，必须重复编写整套标签页判断逻辑，部分场景还要按标签页解析不同参数，维护成本越来越高。

现有核心代码：

var activeTab = TabContainer.ActiveTab;
if (activeTab == abc_Tab)
{
    // abc标签页导出逻辑
}
else if (activeTab == def_Tab)
{
    // def标签页导出逻辑
}
else if (activeTab == ghi_Tab)
{
    // ghi标签页导出逻辑
}
else if (activeTab == jkl_Tab)
{
    // jkl标签页导出逻辑
}

优化方案：用策略模式+映射表消除重复判断 #

1. 给每个标签页做导出逻辑映射表 #

把每个标签页对应的各类导出逻辑（Excel、PDF、CSV）、参数解析逻辑封装成独立函数，用一个对象将标签页实例与对应逻辑组关联，相当于给每个标签页打造专属“导出工具箱”。

示例代码（以JavaScript为例）：

// 标签页导出策略映射：key为标签页实例，value为该标签页的所有导出相关逻辑
const tabExportMap = {
    [abc_Tab]: {
        exportExcel: () => { /* abc标签页Excel导出逻辑 */ },
        exportPdf: () => { /* abc标签页PDF导出逻辑 */ },
        exportCsv: () => { /* abc标签页CSV导出逻辑 */ },
        parseParams: () => { /* abc标签页参数解析逻辑，返回参数对象 */ }
    },
    [def_Tab]: {
        exportExcel: () => { /* def标签页Excel导出逻辑 */ },
        exportPdf: () => { /* def标签页PDF导出逻辑 */ },
        exportCsv: () => { /* def标签页CSV导出逻辑 */ },
        parseParams: () => { /* def标签页参数解析逻辑 */ }
    },
    // 其他标签页按相同格式扩展即可
};

2. 定义通用导出入口函数 #

在内容页写一个统一的导出入口，母版页只需传入导出类型（Excel/PDF/CSV），内部自动通过映射表匹配当前激活标签页的对应逻辑，彻底告别重复判断。

// 内容页通用导出函数，接收导出类型参数
function doExport(exportType) {
    const activeTab = TabContainer.ActiveTab;
    const tabLogic = tabExportMap[activeTab];
    
    // 容错处理：当前标签页未配置对应导出类型时提示
    if (!tabLogic || !tabLogic[exportType]) {
        console.warn(`当前标签页不支持${exportType}导出`);
        return;
    }
    
    // 按需解析参数（部分标签页不需要的话可省略）
    const exportParams = tabLogic.parseParams ? tabLogic.parseParams() : {};
    // 执行对应导出逻辑
    tabLogic[exportType](exportParams);
}

3. 母版页调用简化 #

母版页无需关心标签页判断逻辑，直接调用内容页的doExport并传入导出类型即可：

// 母版页导出Excel按钮点击事件
function onExportExcelClick() {
    contentPage.doExport('exportExcel');
}

// 新增导出CSV时，直接添加调用逻辑，无需修改判断代码
function onExportCsvClick() {
    contentPage.doExport('exportCsv');
}

优化优势 #

• 消除重复代码：新增导出类型或标签页时，仅需在映射表中扩展对应逻辑，不用复制粘贴if-else分支。
• 逻辑更清晰：每个标签页的导出逻辑集中管理，修改某标签页逻辑时无需翻找大量判断代码。
• 扩展性极强：后续新增任何导出类型或标签页，仅需扩展映射表，符合开闭原则（对扩展开放，对修改关闭）。

如果后端也存在类似重复判断逻辑，同样可以复用这个思路——比如定义每个标签页对应的导出服务类，用字典映射标签页标识到服务实例，统一处理导出请求。

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