為JavaScript添加重載函數(shù)的輔助方法
更新時(shí)間:2010年07月04日 19:37:11 作者:
大家都習(xí)慣了重載帶來(lái)的便利。JavaScript有沒(méi)有重載呢?有人會(huì)回答沒(méi)有,因?yàn)楹瘮?shù)會(huì)被覆蓋;有人說(shuō)有,我們可以模擬重載這 一操作。
JavaScript的重載函數(shù),一般是靠對(duì)arguments判斷來(lái)操作的。
比如:
var afunc = function() {
args = arguments;
if(args.length == 1) {
console.log(1);
}else if(args.length == 2) {
console.log(2);
}else if (args.length == 3) {
console.log(3);
}
}
可以想象如果重載數(shù)量多的時(shí)候,要有多少的if-else判斷?。ㄊ聦?shí)上重載數(shù)量應(yīng)該不會(huì)太多吧)。
如果要對(duì)js函數(shù)進(jìn)行重載,代碼量肯定是多的。那么能不能想辦法使代碼清晰點(diǎn),再減少那些相同代碼的書(shū)寫(xiě)呢?
這就是我寫(xiě)篇文章和相關(guān)代碼的起因了。
慣例先上代碼:
/** KOverLoad
一個(gè)創(chuàng)建重載函數(shù)的輔助方法。
其實(shí)這個(gè)方法只是幫忙整理了參數(shù)不同的情況下的重載方法。
如果還要對(duì)參數(shù)類(lèi)型進(jìn)行判斷重載的話,請(qǐng)?jiān)谔峁┑姆椒ㄖ凶约簩?shí)現(xiàn)。
@Author ake 2010-05-02
@weblog http://www.cnblogs.com/akecn
*/
var KOverLoad = function(scope) {
this.scope = scope || window; //默認(rèn)添加方法到這個(gè)對(duì)象中。同時(shí)添加的方法的this指向該對(duì)象。
this.list = {}; //存放重載函數(shù)的地方。
return this;
};
KOverLoad.prototype = {
//添加一個(gè)重載的方法。
//@param arg<Function> 重載的方法。
add:function(arg) {
if(typeof arg == "function") {
this.list[arg.length] = arg; //以參數(shù)數(shù)量做標(biāo)識(shí)存儲(chǔ)重載方法。很顯然如果你的重載方法參數(shù)數(shù)量
}
return this;
},
//添加完所有的重載函數(shù)以后,調(diào)用該方法來(lái)創(chuàng)建重載函數(shù)。
//@param fc<String> 重載函數(shù)的方法名。
load:function(fc) {
var self = this, args, len;
this.scope[fc] = function() { //將指定作用域的指定方法 設(shè)為重載函數(shù)。
args = Array.prototype.slice.call(arguments, 0); //將參數(shù)轉(zhuǎn)換為數(shù)組。
len = args.length;
if(self.list[len]) { //根據(jù)參數(shù)數(shù)量調(diào)用符合的重載方法。
self.list[len].apply(self.scope, args); //這里指定了作用域和參數(shù)。
}else{
throw new Error("undefined overload type");
}
}
}
};
使用 方法是我覺(jué)得比較清晰的方法:
//這是可選的作用對(duì)象。
var s =function(){}
s.prototype = {
init:function() {
console.log();
}
}
//構(gòu)造函數(shù)的參數(shù)可以是Object類(lèi)型的或者其他合法的類(lèi)型,如果不指定,則注冊(cè)到window對(duì)象中,并且作用域也是window。其實(shí)就是添加該重載方法到什么地方而已。
new KOverLoad(s.prototype).add(function(a) {
console.log("one",a,this)
})
.add(function(a,b) {
console.log("two",a,b,this)
})
.add(function(a,b,c) {
console.log("three",a,b,c,this)
})
.add(function(a,b,c,d) {
console.log("four",a,b,c,d,this)
})
.load("func"); //在這里的參數(shù)就是要?jiǎng)?chuàng)建的重載函數(shù)的方法名稱(chēng)。
完成以上操作以后,s.func就是一個(gè)重載函數(shù)。
我們可以這樣調(diào)用重載函數(shù):
var t = new s();
t.func();//拋出錯(cuò)誤異常。因?yàn)闆](méi)有指定零參數(shù)時(shí)的函數(shù)
t.func(”o”);//one o Object {}
t.func(1,2);//two 1 2 Object {}
簡(jiǎn)單的代碼而已,如果各位有建議或者意見(jiàn),歡迎留言指教。
比如:
復(fù)制代碼 代碼如下:
var afunc = function() {
args = arguments;
if(args.length == 1) {
console.log(1);
}else if(args.length == 2) {
console.log(2);
}else if (args.length == 3) {
console.log(3);
}
}
可以想象如果重載數(shù)量多的時(shí)候,要有多少的if-else判斷?。ㄊ聦?shí)上重載數(shù)量應(yīng)該不會(huì)太多吧)。
如果要對(duì)js函數(shù)進(jìn)行重載,代碼量肯定是多的。那么能不能想辦法使代碼清晰點(diǎn),再減少那些相同代碼的書(shū)寫(xiě)呢?
這就是我寫(xiě)篇文章和相關(guān)代碼的起因了。
慣例先上代碼:
復(fù)制代碼 代碼如下:
/** KOverLoad
一個(gè)創(chuàng)建重載函數(shù)的輔助方法。
其實(shí)這個(gè)方法只是幫忙整理了參數(shù)不同的情況下的重載方法。
如果還要對(duì)參數(shù)類(lèi)型進(jìn)行判斷重載的話,請(qǐng)?jiān)谔峁┑姆椒ㄖ凶约簩?shí)現(xiàn)。
@Author ake 2010-05-02
@weblog http://www.cnblogs.com/akecn
*/
var KOverLoad = function(scope) {
this.scope = scope || window; //默認(rèn)添加方法到這個(gè)對(duì)象中。同時(shí)添加的方法的this指向該對(duì)象。
this.list = {}; //存放重載函數(shù)的地方。
return this;
};
KOverLoad.prototype = {
//添加一個(gè)重載的方法。
//@param arg<Function> 重載的方法。
add:function(arg) {
if(typeof arg == "function") {
this.list[arg.length] = arg; //以參數(shù)數(shù)量做標(biāo)識(shí)存儲(chǔ)重載方法。很顯然如果你的重載方法參數(shù)數(shù)量
}
return this;
},
//添加完所有的重載函數(shù)以后,調(diào)用該方法來(lái)創(chuàng)建重載函數(shù)。
//@param fc<String> 重載函數(shù)的方法名。
load:function(fc) {
var self = this, args, len;
this.scope[fc] = function() { //將指定作用域的指定方法 設(shè)為重載函數(shù)。
args = Array.prototype.slice.call(arguments, 0); //將參數(shù)轉(zhuǎn)換為數(shù)組。
len = args.length;
if(self.list[len]) { //根據(jù)參數(shù)數(shù)量調(diào)用符合的重載方法。
self.list[len].apply(self.scope, args); //這里指定了作用域和參數(shù)。
}else{
throw new Error("undefined overload type");
}
}
}
};
使用 方法是我覺(jué)得比較清晰的方法:
//這是可選的作用對(duì)象。
復(fù)制代碼 代碼如下:
var s =function(){}
s.prototype = {
init:function() {
console.log();
}
}
//構(gòu)造函數(shù)的參數(shù)可以是Object類(lèi)型的或者其他合法的類(lèi)型,如果不指定,則注冊(cè)到window對(duì)象中,并且作用域也是window。其實(shí)就是添加該重載方法到什么地方而已。
復(fù)制代碼 代碼如下:
new KOverLoad(s.prototype).add(function(a) {
console.log("one",a,this)
})
.add(function(a,b) {
console.log("two",a,b,this)
})
.add(function(a,b,c) {
console.log("three",a,b,c,this)
})
.add(function(a,b,c,d) {
console.log("four",a,b,c,d,this)
})
.load("func"); //在這里的參數(shù)就是要?jiǎng)?chuàng)建的重載函數(shù)的方法名稱(chēng)。
完成以上操作以后,s.func就是一個(gè)重載函數(shù)。
我們可以這樣調(diào)用重載函數(shù):
復(fù)制代碼 代碼如下:
var t = new s();
t.func();//拋出錯(cuò)誤異常。因?yàn)闆](méi)有指定零參數(shù)時(shí)的函數(shù)
t.func(”o”);//one o Object {}
t.func(1,2);//two 1 2 Object {}
簡(jiǎn)單的代碼而已,如果各位有建議或者意見(jiàn),歡迎留言指教。
您可能感興趣的文章:
- 如何實(shí)現(xiàn)JS函數(shù)的重載
- js 覆蓋和重載 函數(shù)
- js中方法重載如何實(shí)現(xiàn)?以及函數(shù)的參數(shù)問(wèn)題
- JS函數(shù)重載的解決方案
- 有關(guān)于JS構(gòu)造函數(shù)的重載和工廠方法
- Javascript基礎(chǔ) 函數(shù)“重載” 詳細(xì)介紹
- 詳解JS函數(shù)重載
- JavaScript中的函數(shù)重載深入理解
- 添加JavaScript重載函數(shù)的輔助方法2
- javascript函數(shù)重載解決方案分享
- 通過(guò)實(shí)例理解javascript中沒(méi)有函數(shù)重載的概念
- JavaScript函數(shù)重載操作實(shí)例淺析
相關(guān)文章
解析JavaScript中點(diǎn)號(hào)“.”的多義性
這篇文章主要介紹了JavaScript中點(diǎn)號(hào)“.”的多義性。需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2013-12-12jQuery實(shí)現(xiàn)手風(fēng)琴特效
這篇文章主要為大家詳細(xì)介紹了前端js實(shí)現(xiàn)手風(fēng)琴效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-01-01ASP中Sub和Function的區(qū)別說(shuō)明
主要的區(qū)別是有返回值,一般sub是用來(lái)調(diào)用大量的內(nèi)容的時(shí)候用sub,對(duì)于需要計(jì)算并需要返回值的時(shí)候用function,多用function定義函數(shù)。2011-01-01js判斷數(shù)組是否包含某個(gè)字符串變量的實(shí)例
下面小編就為大家分享一篇js判斷數(shù)組是否包含某個(gè)字符串變量的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助2017-11-11JS實(shí)現(xiàn)HTML標(biāo)簽轉(zhuǎn)義及反轉(zhuǎn)義
本文主要介紹了JS實(shí)現(xiàn)HTML標(biāo)簽轉(zhuǎn)義及反轉(zhuǎn)義的方法。具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-01-01iOS和Android用同一個(gè)二維碼實(shí)現(xiàn)跳轉(zhuǎn)下載鏈接的方法
這篇文章給大家分享的是iOS和Android掃描同一個(gè)二維碼,分別跳到各自的下載鏈接的實(shí)現(xiàn)方法,文中給出了實(shí)例代碼,有需要的朋友們可以參考借鑒。2016-09-09自定義javascript驗(yàn)證框架示例【附源碼下載】
這篇文章主要介紹了自定義javascript驗(yàn)證框架,結(jié)合實(shí)例形式分析了javascript正則驗(yàn)證相關(guān)操作技巧,并附帶源碼供讀者下載參考,需要的朋友可以參考下2019-05-05JS+CSS設(shè)置img在DIV中只顯示Img垂直居中的部分
img的寬和Div相同,但高不固定,要求只顯示Img垂直居中的部分,下面有個(gè)不錯(cuò)的示例,感興趣的朋友可以參考下2013-10-10