function httpRequest(url,callback){
// httpRequest不是阻塞函數(shù) 簡(jiǎn)單點(diǎn)說(shuō)就是不會(huì)阻止下面的函數(shù)執(zhí)行
//用回調(diào)函數(shù)去解決
var xhr = new XMlHttpRequest();
xhr.open("GET",url,ture);
xhr.onreadystatechange = function(){
if (xhr.readyState ==4) {
callback(xhr.responseText);
};
}
xhr.send();
}
var text;
httpRequest("text.txt", function(result){
text = result;
console.log(text);
})
A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.
這是js里的解釋了乃沙,字面上理解下來(lái)就是
回調(diào)就是一個(gè)函數(shù)的調(diào)用過(guò)程
那么就從理解這個(gè)調(diào)用過(guò)程開(kāi)始吧丈积。函數(shù)a有一個(gè)參數(shù)毁兆,這個(gè)參數(shù)是個(gè)函數(shù)b赐纱,當(dāng)函數(shù)a執(zhí)行完以后執(zhí)行函數(shù)b。那么這個(gè)過(guò)程就叫回調(diào)。
其實(shí)中文也很好理解:回調(diào),回調(diào),就是回頭調(diào)用的意思蟆炊。函數(shù)a的事先干完,回頭再調(diào)用函數(shù)b瀑志。
舉個(gè)現(xiàn)實(shí)的例子:約會(huì)結(jié)束后你送你女朋友回家涩搓,離別時(shí),你肯定會(huì)說(shuō):“到家了給我發(fā)條信息劈猪,我很擔(dān)心你昧甘。”對(duì)不战得,然后你女朋友回家以后還真給你發(fā)了條信息充边。
其實(shí)這就是一個(gè)回調(diào)的過(guò)程。你留了個(gè)函數(shù)b(要求女朋友給你發(fā)條信息)給你女朋友,然后你女朋友回家浇冰,回家的動(dòng)作是函數(shù)a贬媒。她必須先回到家以后,函數(shù)a的內(nèi)容執(zhí)行完了肘习,再執(zhí)行函數(shù)b际乘,然后你就收到一條信息了。
這里必須清楚一點(diǎn):函數(shù)b是你以參數(shù)形式傳給函數(shù)a的漂佩,那么函數(shù)b就叫回調(diào)函數(shù)脖含。
也許有人有疑問(wèn)了:一定要以參數(shù)形式傳過(guò)去嗎,我不可以直接在函數(shù)a里面調(diào)用函數(shù)b嗎投蝉?確實(shí)可以养葵。
解惑:如果你直接在函數(shù)a里調(diào)用的話,那么這個(gè)回調(diào)函數(shù)就被限制死了瘩缆。但是使用函數(shù)做參數(shù)就有下面的好處:當(dāng)你a(b)的時(shí)候函數(shù)b就成了回調(diào)函數(shù)关拒,而你還可以a(c)這個(gè)時(shí)候,函數(shù)c就成了回調(diào)函數(shù)咳榜。如果你寫(xiě)成了function a(){...;b();}就失去了變量的靈活性夏醉。
i think this callback only is a design mode of coding
下面用代碼來(lái)證實(shí)我的理解爽锥。
<html>
<head>
<title>回調(diào)函數(shù)(callback)</title>
<script language="javascript" type="text/javascript">
function a(callback)
{
alert("我是parent函數(shù)a涌韩!");
alert("調(diào)用回調(diào)函數(shù)");
callback();
}
function b(){
alert("我是回調(diào)函數(shù)b");
}
function c(){
alert("我是回調(diào)函數(shù)c");
}
function test()
{
a(b);
a(c);
}
</script>
</head>
<body>
<h1>學(xué)習(xí)js回調(diào)函數(shù)</h1>
<button onClick=test()>click me</button>
<p>應(yīng)該能看到調(diào)用了兩個(gè)回調(diào)函數(shù)</p>
</body>
</html>