Javascript 如何用jQuery中的函数替换重复的代码块

我的页面上有多个选项卡，在每个选项卡上我使用插件声明一个透视表，并向其中添加一个事件。代码是重复的，因为唯一的区别是枢轴中的过滤器

我想创建一个带有参数的函数，并在每个选项卡上调用它。我替换了当前代码：

var pivotAsia = new WebDataRocks({
    container: "wdr-component-1",
    toolbar: true,
    report: {
        dataSource: { data: getJSONData() },
        slice: {
            rows: [{ uniqueName: "continent" }],
            columns: [{ uniqueName: "Measures" }],
            measures: [{ uniqueName: "country", aggregation: "count" }],
            reportFilters: [{
                uniqueName: "continent",
                "filter": { "members": [ "continent.Asia" ] }  }]
        }
    }
});

$('#tab1').on( 'shown.bs.tab', function (e) { pivotAsia.refresh(); });

与：

function pivot (pivotName, component_id, continentFilter) {
var pivotName = new WebDataRocks({
    container: component_id,
    toolbar: true,
    report: {
        dataSource: { data: getJSONData() },
        slice: {
            rows: [{ uniqueName: "continent" }],
            columns: [{ uniqueName: "Measures" }],
            measures: [{ uniqueName: "country", aggregation: "count" }],
            reportFilters: [{
                uniqueName: "continent",
                "filter": { "members": [ "continent." + continentFilter ] }  }]
        }
    }
});
}

然后我为亚洲和欧洲调用了两次函数

pivot ('pivotAsia', $('#wdr-component-1'), 'Asia');
pivot ('pivotEurope', $('#wdr-component-2'), 'Europe');

调用函数时，我仍然得到

未捕获的引用错误：未定义亚洲或欧洲

有什么建议吗？我做错了什么？多谢各位


var pivotsia=new-WebDataRocks({
容器：“wdr-component-1”，
工具栏：对，
报告：{
数据源：{
数据：getJSONData（）
},
切片：{
行：[{
唯一名称：“大陆”
}],
栏目：[{
uniqueName：“措施”
}],
措施：[{
uniqueName：“国家”，
聚合：“计数”
}],
报表过滤器：[{
uniqueName：“大陆”，
“过滤器”：{
“成员”：[
“大陆.亚洲”
]
}
}]
}
}
});
$（'#tab1'）.on（'show.bs.tab'，函数（e）{
pivotsia.refresh（）；
});
var pivotEurope=新的WebDataRocks({
容器：“wdr-component-2”，
工具栏：对，
报告：{
数据源：{
数据：getJSONData（）
},
切片：{
行：[{
唯一名称：“大陆”
}],
栏目：[{
uniqueName：“措施”
}],
措施：[{
uniqueName：“国家”，
聚合：“计数”
}],
报表过滤器：[{
uniqueName：“大陆”，
“过滤器”：{
“成员”：[
“欧洲大陆”
]
}
}]
}
}
});
$（'#tab2'）.on（'show.bs.tab'，函数（e）{
pivotEurope.refresh（）；
});
/*这里我想用一个函数替换重复的代码
函数透视（透视名称、组件id、过滤器）{
var pivotName=新的WebDataRocks({
容器：组件id，
工具栏：对，
报告：{
数据源：{data:getJSONData（）}，
切片：{
行：[{uniqueName:“大陆”}]，
列：[{uniqueName:“Measures”}]，
措施：[{统一名称：“国家”，
聚合：“计数”}]，
reportFilters:[{uniqueName:“大陆”，
“筛选器”：{“成员”：[“大陆”。+大陆筛选器]}
}]
}
}
});
}
pivot（‘pivotAsia’，$（‘wdr-component-1’，‘Asia’）*/
函数getJSONData（）{
返回[
{
“国家”：“阿富汗”，
“大陆”：“亚洲”
},
{
“国家”：“阿尔巴尼亚”，
“大陆”：“欧洲”
},
{
“国家”：“阿尔及利亚”，
“大陆”：“非洲”
},
{
“国家”：“美属萨摩亚”，
“大陆”：“大洋洲”
},
{
“国家”：“安道尔”，
“大陆”：“欧洲”
},
{
“国家”：“安哥拉”，
“大陆”：“非洲”
},
{
“国家”：“安圭拉”，
“大陆”：“北美”
},
{
“国家”：“南极洲”，
“大陆”：“南极洲”
},
{
“国家”：“安提瓜和巴布达”，
“大陆”：“北美”
},
{
“国家”：“阿根廷”，
“大陆”：“南美洲”
},
{
“国家”：“亚美尼亚”，
“大陆”：“亚洲”
},
{
“国家”：“阿鲁巴”，
“大陆”：“北美”
},
{
“国家”：“澳大利亚”，
“大陆”：“大洋洲”
},
{
“国家”：“奥地利”，
“大陆”：“欧洲”
},
{
“国家”：“阿塞拜疆”，
“大陆”：“亚洲”
},
{
“国家”：“巴哈马”，
“大陆”：“北美”
},
{
“国家”：“巴林”，
“大陆”：“亚洲”
},
{
“国家”：“孟加拉国”，
“大陆”：“亚洲”
},
{
“国家”：“巴巴多斯”，
“大陆”：“北美”
},
{
“国家”：“白俄罗斯”，
“大陆”：“欧洲”
},
{
“国家”：“比利时”，
“大陆”：“欧洲”
},
{
“国家”：“伯利兹”，
“大陆”：“北美”
},
{
“国家”：“贝宁”，
“大陆”：“非洲”
},
{
“国家”：“百慕大”，
“大陆”：“北美”
},
{
“国家”：“不丹”，
“大陆”：“亚洲”
},
{
“国家”：“玻利维亚”，
“大陆”：“南美洲”
},
{
“国家”：“波斯尼亚和黑塞哥维那”，
“大陆”：“欧洲”
},
{
“国家”：“博茨瓦纳”，
“大陆”：“非洲”
},
{
“国家”：“布韦岛”，
“大陆”：“南极洲”
},
{
“国家”：“巴西”，
“大陆”：“南美洲”
},
{
“国家”：“英属印度洋领土”，
“大陆”：“非洲”
},
{
“国家”：“文莱”，
“大陆”：“亚洲”
},
{
“国家”：“保加利亚”，
“大陆”：“欧洲”
},
{
“国家”：“布基纳法索”，
“大陆”：“非洲”
},
{
“国家”：“布隆迪”，
“大陆”：“非洲”
},
{
“国家”：“柬埔寨”，
“大陆”：“亚洲”
},
{
“国家”：“喀麦隆”，
“大陆”：“非洲”
},
{
“国家”：“加拿大”，
“大陆”：“北美”
},
{
“国家”：“佛得角”，
“大陆”：“非洲”
},
{
“国家”：“开曼群岛”，
“大陆”：“北美”
},
{
“国家”：“中非共和国”，
“大陆”：
var pivotAsia = pivot ($('#wdr-component-1'), 'Asia');
var pivotEurope = pivot ($('#wdr-component-2'), 'Europe');

function pivot (component_id, continentFilter) {
    return new WebDataRocks({
        container: component_id,
        toolbar: true,
        report: {
            dataSource: { data: getJSONData() },
            slice: {
                rows: [{ uniqueName: "continent" }],
                columns: [{ uniqueName: "Measures" }],
                measures: [{ uniqueName: "country", aggregation: "count" }],
                reportFilters: [{
                    uniqueName: "continent",
                    "filter": { "members": [ "continent." + continentFilter ] }  }]
            }
        }
    });
}

var pivotAsia = pivot ($('#wdr-component-1'), 'Asia');
var pivotEurope = pivot ($('#wdr-component-2'), 'Europe');

class Pivot {
    constructor(container, continentFilter) {
        this.pivot = new WebDataRocks({
            container,
            toolbar: true,
            report: {
                dataSource: { data: getJSONData() },
                slice: {
                rows: [{ uniqueName: "continent" }],
                columns: [{ uniqueName: "Measures" }],
                measures: [{ uniqueName: "country", 
                    aggregation: "count" }],
                reportFilters: [{ uniqueName: "continent",
                    "filter": { "members": [ "continent." + continentFilter ] }  
                }]
                }
            }
        });
    } 

    refresh(evt){
        this.pivot.refresh();
    }
}

var pivotAsia = new Pivot ($('#wdr-component-1'), 'Asia')
var pivotEurope = new Pivot ($('#wdr-component-1'), 'Europe')

$('#tab2').on( 'shown.bs.tab', pivotAsia.refresh.bind(pivotAsia));
$('#tab2').on( 'shown.bs.tab', pivotEurope.refresh.bind(pivotEurope));