JS中把函數作為另一函數的參數傳遞方法(總結)
今天在給元素註冊事件的時候,使用addEventListener遇到了一個問題,這個好像之前也遇到過,覺得有必要總結一下,就是js函數作為參數引發的問題。首先看以下代碼,覺得下面代碼有問題嗎?是否能達到點擊id3對應的元素後,彈出id3呢?
例1
var obj3=document.getElementById("id3");
obj3.addEventListener("click",curClick("id1"),true);
function curClick(id){
alert(id);
}
答案是否定,不能達到我想要的效果,因為這行代碼在頁面載入完成時候,就會彈出id3。當我單擊id3對應的元素時候,頁面沒有任何反應。
於是我將代碼改為如下兩種情況:
例2
var obj3=document.getElementById("id3");
obj3.addEventListener("click",function(e){curClick("id3");stopPropagation(e)},true);
function curClick(id){
alert(id);
}
例3
var obj1=document.getElementById("id1");
obj1.addEventListener("click",curClick1,true);
function curClick1(){
alert("okey");
}
這次執行正常了,這是為什麼呢?
因為在JS世界裡curClick("id3")就是直接調用curClick("id3"),而非將其作為一個參數來傳遞,如果要將其作為一個參數來傳遞,如果不需要傳遞參數,直接傳遞函數名就可,如果需要傳遞參數,有兩種解決辦法
方法一:藉助匿名函數,將要傳遞的函數,放在匿名函數中,將匿名函數作為參數如例2
eg:將function(){myfunction(val1,val2,......);}作為參數傳遞。
第二:改寫需要傳遞函數
function curClick1(val){
<span stylex="white-space:pre"> </span>return function(){
alert(val);
};
}
作者:資源庫
原文:https://www.zyku.net/js/1447.html
※基於Python的理論與實現 感知機
※vue的雙向綁定和依賴收集
TAG:程序員小新人學習 |