JS函數(shù)重載的解決方案
在面向?qū)ο蟮木幊讨?,很多語(yǔ)言都支持函數(shù)重載,能根據(jù)函數(shù)傳遞的不同個(gè)數(shù)、類型的參數(shù)來(lái)做不同的操作,JS對(duì)它卻不支持,需要我們額外做些小動(dòng)作。
在JS的函數(shù)執(zhí)行上下文中有一個(gè)名為arguments的有意思的變量,它以數(shù)組的形式存儲(chǔ)了函數(shù)執(zhí)行時(shí)傳遞過(guò)來(lái)的所有參數(shù),即使函數(shù)定義沒(méi)有定義這 么多個(gè)形參。還有一個(gè)特別之處就是跟Array類型相比,arguments變量有且只有一個(gè)length屬性,Array的方法,例如push、pop 等,它并不具備,它只是一個(gè)“偽數(shù)組”:具有l(wèi)ength屬性,存儲(chǔ)的數(shù)組能夠用數(shù)組訪問(wèn)符[]來(lái)訪問(wèn),并且是只讀不可寫(xiě)。
一、對(duì)于不同個(gè)數(shù)參數(shù)的重載
這里應(yīng)該很明白,直接用arguments函數(shù)的length屬性來(lái)判斷就可以了。
<script type="text/javascript">
function talk(msg,handler){
var len = arguments.length;
//傳遞過(guò)來(lái)一個(gè)參數(shù)的時(shí)候執(zhí)行
if(len==1){
alert("Function say:"+msg);
}
//傳遞過(guò)來(lái)兩個(gè)參數(shù)的時(shí)候執(zhí)行
else if(len==2){
handler(msg);
}
}
talk("demo");
talk("demo",function(w){alert("Handler say:"+w);});
</script>
二、對(duì)于不同類型的參數(shù)的重載
對(duì)于JS這樣一種動(dòng)態(tài)類型的語(yǔ)言,這種變量聲明的隨意性淡化了嚴(yán)格的變量類型在開(kāi)發(fā)人員腦子里的重要性(PS:同樣是基于ECMA體系的,AS就引入 了變量聲明的強(qiáng)制類型),很多意想不到的BUG其實(shí)都是由這種變量類型的自動(dòng)轉(zhuǎn)換造成的。其實(shí)JS提供了很準(zhǔn)確的方法讓我們來(lái)嚴(yán)格檢測(cè)變量的類型,比較通 用的就是typeof方法和constructor屬性。
1、typeof variable 返回變量類型
temp = "say"; //string
temp = 1; //number
temp = undefined; //undefined
temp = null; //object
temp = {}; //object
temp = []; //object
temp = true; //boolean
temp = function (){} //function
alert(typeof temp);
通過(guò)上面的測(cè)試你可以看出來(lái),對(duì)于null,Object,Array返回的都是object類型,而使用下面的方法就可以解決這個(gè)困擾。
2.constructor屬性檢測(cè)變量類型
JS中每個(gè)對(duì)象都有constructor屬性,它是用來(lái)引用構(gòu)造此對(duì)象的函數(shù),通過(guò)對(duì)這個(gè)引用的判斷就可以檢測(cè)變量類型了。
temp = "say";
temp.constructor==String; //true
temp= {};
temp.constructor == Object;//true
temp= [];
temp.constructor == Array;//true
通過(guò)上面的測(cè)試已經(jīng)很容易的把Array和Object類型的變量區(qū)分開(kāi)了。下面我們來(lái)對(duì)自定義的對(duì)象做個(gè)測(cè)試看看會(huì)發(fā)生什么。
//自定義對(duì)象
function Ball(){}
//實(shí)例化一個(gè)對(duì)象
var basketBall = new Ball();
basketBall.constructor==Ball; //true
這可以說(shuō)明constructor屬性對(duì)于自定義的對(duì)象一樣適用。
在弄清楚了上面兩個(gè)方法的適用以后再來(lái)回到JS函數(shù)重載的模擬上來(lái),下面這個(gè)例子是根據(jù)參數(shù)類型來(lái)重載。
function talk(msg){
var t = typeof msg;
if(t=="string"){
alert("It's a string");
}
else if(t=="number"){
alert("It's a number");
}
}
talk(10); //It's a string
talk("demo"); //It's a number
附上一個(gè)很巧妙的嚴(yán)格檢測(cè)參數(shù)類型和個(gè)數(shù)的函數(shù):
//依據(jù)參數(shù)列表來(lái)嚴(yán)格地檢查一個(gè)變量列表的類型
function strict( types, args ) {
//確保參數(shù)的數(shù)目和類型核匹配
if ( types.length != args.length ) {
//如果長(zhǎng)度不匹配,則拋出異常
throw "Invalid number of arguments. Expected " + types.length + ", received " + args.length + " instead.";
}
//遍歷每一個(gè)參數(shù),檢查基類型
for ( var i = 0; i < args.length; i++ ) {
//如JavaScript某一項(xiàng)類型不匹配,則拋出異常
if ( args[i].constructor != types[i] ) {
throw "Invalid argument type. Expected " + types[i].name +", received " + args[i].constructor.name + " instead.";
}
}
}
//上述方法的使用
function doFunction(id,name){
//檢測(cè)參數(shù)個(gè)數(shù)和類型
strict([Number,String],arguments);
..
}
- 如何實(shí)現(xiàn)JS函數(shù)的重載
- js 覆蓋和重載 函數(shù)
- js中方法重載如何實(shí)現(xiàn)?以及函數(shù)的參數(shù)問(wèn)題
- 有關(guān)于JS構(gòu)造函數(shù)的重載和工廠方法
- Javascript基礎(chǔ) 函數(shù)“重載” 詳細(xì)介紹
- 詳解JS函數(shù)重載
- 為JavaScript添加重載函數(shù)的輔助方法
- JavaScript中的函數(shù)重載深入理解
- 添加JavaScript重載函數(shù)的輔助方法2
- javascript函數(shù)重載解決方案分享
- 通過(guò)實(shí)例理解javascript中沒(méi)有函數(shù)重載的概念
- JavaScript函數(shù)重載操作實(shí)例淺析
相關(guān)文章
原生JS實(shí)現(xiàn)Ajax跨域請(qǐng)求flask響應(yīng)內(nèi)容
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)Ajax跨域請(qǐng)求flask響應(yīng)內(nèi)容,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-10-10
JS 組件系列之BootstrapTable的treegrid功能
這篇文章主要介紹了JS 組件系列之BootstrapTable的treegrid功能,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2017-06-06
JavaScript檢測(cè)彈出窗口是否已經(jīng)關(guān)閉的方法
這篇文章主要介紹了JavaScript檢測(cè)彈出窗口是否已經(jīng)關(guān)閉的方法,涉及javascript中window屬性的closed屬性的使用技巧,需要的朋友可以參考下2015-03-03
簡(jiǎn)單實(shí)現(xiàn)jQuery輪播效果
這篇文章主要教大家如何簡(jiǎn)單實(shí)現(xiàn)jQuery輪播效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-08-08
js實(shí)現(xiàn)鼠標(biāo)滑過(guò)文字鏈接色彩變化的效果
這篇文章主要介紹了js實(shí)現(xiàn)鼠標(biāo)滑過(guò)文字鏈接色彩變化的效果,涉及javascript鼠標(biāo)事件及樣式操作的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-05-05

