如何在javascript中区分因参数而异的类似方法?
我用类似的方法定义了一个js文件,但它们可能因应用程序中所选国家的不同而有所不同,这只是我正在做的一个小演示:如何在javascript中区分因参数而异的类似方法?,javascript,Javascript,我用类似的方法定义了一个js文件,但它们可能因应用程序中所选国家的不同而有所不同,这只是我正在做的一个小演示: HTML Date: <span id="date"></span> <br> <p>Current country: <span id="country"></span></p> JS (function() { // data retrieved from somewhere: 1.
HTML
Date: <span id="date"></span>
<br>
<p>Current country: <span id="country"></span></p>
JS
(function() {
// data retrieved from somewhere: 1.Germany, 2.France, etc ...
var countryId = 1;
function myModule() {
this.common = {
getCountryName: function() {
return "I'm the whole world!";
},
getDate: function() {
return new Date();
}
};
this.germany = {
getCountryName: function() {
return "I'm Germany!";
}
};
this.france = {
getCountryName: function() {
return "I'm France!";
}
};
return {
common: this.common,
germany: this.germany,
france: this.france
}
}
var fn = function(fnName) {
var country, module, exists;
country = getCountry(countryId);
module = new myModule();
exists = !!module[country] && !!module[country][fnName];
return exists ? module[country][fnName] : module.common[fnName];
};
function getCountry(countryId) {
var countryName = "";
switch (countryId) {
case 1:
countryName = "germany";
break;
case 2:
countryName = "france";
break;
};
return countryName;
}
window.demoModule = {
getDate: fn("getDate"),
getCountryName: fn("getCountryName")
}
}());
(function() {
$(document).ready(initialize);
function initialize() {
$("#date").text(demoModule.getDate().toLocaleDateString());
$("#country").text(demoModule.getCountryName());
}
}());
HTML
日期:
当前国家:
JS
(功能(){
//从某处检索到的数据:1.德国,2.法国等。。。
var countryId=1;
函数myModule(){
此.common={
getCountryName:函数(){
返回“我是整个世界!”;
},
getDate:函数(){
返回新日期();
}
};
这是德国={
getCountryName:函数(){
返回“我是德国人!”;
}
};
这是法国={
getCountryName:函数(){
返回“我是法国人!”;
}
};
返回{
共同的:这个,共同的,
德国:这个,德国,
法国:这是法国
}
}
var fn=函数(fnName){
var国家,模块,存在;
country=getCountry(countryId);
模块=新的myModule();
存在=!!模块[国家]&!!模块[国家][fname];
返回是否存在?模块[国家][fnName]:模块.通用[fnName];
};
函数getCountry(countryId){
var countryName=“”;
交换机(countryId){
案例1:
countryName=“德国”;
打破
案例2:
countryName=“法国”;
打破
};
返回国家名称;
}
window.demoModule={
getDate:fn(“getDate”),
getCountryName:fn(“getCountryName”)
}
}());
(功能(){
$(文档).ready(初始化);
函数初始化(){
$(“#日期”).text(demoModule.getDate().toLocaleDateString());
$(“#country”).text(demoModule.getCountryName());
}
}());
我想做这样的事情,因为我需要不同的功能取决于所选的国家,但它似乎有点复杂,你知道一个更好的或简单的方法来处理这样的事情吗
小提琴:
考虑到假设您没有做返回国家名称这样琐碎的事情(任何实际数据都应该存储在数据库中,而不是存储在前端代码中),那么最好的解决方案将归结为您实际要做的事情。以下是基于两种不同场景的两个选项: 场景1
您的逻辑基本相同,但有几个国家/地区的例外情况:
开关
打开countryId
函数doLogic(countryId){
//这里有什么可能的共同逻辑吗
交换机(countryId){
案例1:返回“法国”
案例2:返回“德国”
案例3:
案例4:
案例5:返回“3 4和5的特殊逻辑”
默认值:返回“所有剩余项相同”
}
}
控制台日志(doLogic(1))
控制台日志(doLogic(4))
console.log(doLogic(9999))
我不知道是否省略了您的一些代码,但我认为您可以像这样简化模块:
var Country = (function() {
return {
countryId : 3,
germany : 'Im Germany',
france : 'Im France',
initialize : function(countryId)
{
$("#date").text(this.getDate().toLocaleDateString());
$("#country").text(this.getCountry(countryId));
},
getDate: function()
{
return new Date();
},
getCountry : function(countryId)
{
var countryName = "";
switch (countryId) {
case 1:
countryName = "germany";
break;
case 2:
countryName = "france";
break;
default:
countryName = "I'm the whole world!";
};
return countryName;
}
};
})();
Country.initialize();
Country.initialize(1);
问题中的
javascript
有什么问题?没有问题,我正在寻找更好的方法来处理所描述的场景。好的,动态选择多个模块的方法完全适合所描述的场景。当然,这是复杂的,但这种复杂性似乎是内在的。您所展示的特定示例代码可以大大简化,因为countryId
是静态的(与“从某处检索数据”的注释不同),但这取决于您能够简化什么以及您真正需要什么。