javascript 自動綁定JS callback 的方法函數,jscallback
自己寫的一個javascript 智能綁定callback 並且調用執行的函數,主要用於非同步請求的 ajax中:
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body><script> /** * @author default7@zbphp.com * @date 2014-10-17 * @description 通過傳入的參數擷取出函數名稱 * @param args * @returns {string} */ function getFunctionName(args) { var fName = ''; if (typeof args == 'string' && /^[a-zA-Z0-9]+$/.test(args)) { fName = args; } else { var fBody = ''; if (typeof args == 'object' && args.callee) { fBody = args.callee.toString(); } else if (typeof args == 'string') { fBody = args; } if (fBody) { var m = fBody.match(/function\s+([a-zA-Z0-9]+)\s*\(/i); if (m && m[1]) { fName = m[1]; } } } return fName; } var gCallback = []; function addCallback(fName, callback) { if (typeof fName == 'string' && typeof window[fName] == 'function' && typeof callback == 'function') { if (typeof gCallback[fName] == 'undefined') { gCallback[fName] = []; } gCallback[fName].push(callback); } } /** * @description 執行綁定的函數 * @param args */ function execCallback(args) { var fName = getFunctionName(args); if (fName && window[fName] && gCallback[fName]) { for (var i in gCallback[fName]) { gCallback[fName][i](); } gCallback[fName] = [];//只調用一次 } }</script><script> function a() { alert('a'); } function b() { alert('b'); } function c() { alert('c'); } function d() { alert('d'); } function initUser() { execCallback(arguments); } addCallback('initUser', a); addCallback('initUser', b); addCallback('initUser', c); initUser(); addCallback('initUser', d); initUser();</script></body></html>
javascript 為何要用callback傳函數, 而不直接在這個函數裡調用另一個函數
通俗的講就是被調用的函數不知道你要做什麼, 你需要將執行的操作作為回呼函數傳入
比如外掛程式, 當外掛程式執行時你需要自訂一些操作, 外掛程式開發人員不知道你需要什麼操作, 只能預留一個回呼函數介面,供你傳入回呼函數,
例如你寫了一個下拉框外掛程式, 功能是將類比select操作, 那麼當onchange的時候是需要使用者根據需求去處理的, 而你的外掛程式是要給很多人用的, 你不知道每個人onchange的時候要做什麼事情, 這個時候你在onchange你判斷一下是否有A這個函數,有的話就調用,然後繼續處理接下來的邏輯. , 使用者如果在onchange的時候有需求, 傳入A的實現即可. ,就相當於執行使用者的操作了, 就叫回呼函數.
JavaScript裡面的回呼函數(callback)怎傳參數?
這是我針對你的問題寫的一個簡單的例子,你看看:
<html>
<head>
<title>
jsp3
</title>
</head>
<body bgcolor="#ffffff">
<script language="javascript" type="text/javascript">
function A(a,callback){
var b=callback;
alert(a+b);
}
function B(c){
return (-c);
}
</script>
<form method="post" action="jsp3.jsp">
<br><br>
<input type="button" name="Submit" value="Submit" onclick="A(4,B(3));">
</form>
</body>
</html>