萬盛學電腦網

 萬盛學電腦網 >> 腳本專題 >> javascript >> javascript的回調函數應用示例

javascript的回調函數應用示例

 回調函數就是一個通過函數指針調用的函數。下面以示例的方式為大家介紹下其具體的使用

回調函數概念:回調函數就是一個通過函數指針調用的函數。如果你把函數的指針(地址)作為參數傳遞給另一個函數,當這個指針被用為調用它所指向的函數時,我們就說這是回調函數。    JS Api 裡這樣解釋:A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.    使用回調函數的原因:可以把調用者與被調用者分開。調用者不關心誰是被調用者,所有它需知道的,只是存在一個具有某種特定原型、某些限制條件(如返回值為int)的被調用函數。    考慮一個這樣的例子:    假如某個項目的底層和高層是由不同的人員協同完成.底層負責數據的存取,高層負責數據的表示.當高層要用到某個模塊的數據,於是他對底層人員說,我需要你們提供滿足某種需求的數據,你給我提供一個接口.    底層的人員說:我給你提供數據,怎麼展示和處理則是你的事情.我不可能為你每個需求都提供一個數據接口,我給你提供一個通過的接口.你得到數據,然後自己寫函數去展示.由是經過協商,雙方提供了一個這樣的接口:  復制代碼 代碼如下: //data表示底層提供的數據源,funcName表示高層的調用函數    function(data,funcName){    1.data屬於情形1,由底層處理;    2.data屬於情形2,由高層處理,怎麼處理呢?利用高層提供的函數funcName處理    .....    }    我可能還沒說清楚,我們看個例子一下子就明白了  代碼如下: //假如提供的數據源是一整數,為某學生的分數,當num<=0,由底層處理,當n>0時由高層處理.    //將下面這個函數拷貝下來存盤為1.js    function f(num,callback){  if(num<0) {  alert("調用低層函數處理!");  alert("分數不能為負,輸入錯誤!");  }else if(num==0){  alert("調用低層函數處理!");  alert("該學生可能未參加考試!");  }else{  alert("調用高層函數處理!");  callback();  }  }  代碼如下: //將下面這個test.html文件存盤與1.js在一個目錄下:    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">  <html>  <head>  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">  <script src="1.js" type="text/javascript"></script>  <title>無標題文檔</title>  <script type="text/javascript">  function test(){  var p=document.getElementById("pp");  pp.innerText="";  var num=document.getElementById("score").value;  f(num,function(){ //匿名高層處理函數  if(num<60) alert("未及格!");  else if(num<=90) alert("該生成績優良!");  else alert("該生成績優秀!"); })  pp.innerText="by since1978 qq558064!"  }  </script>  </head>    <body>  <p>  回調函數示例:當學生成績score<=0分時候,由底層處理;當score>0時,由高層處理。  </p>  請輸入學生成績<input type="text" id="score">  <input type="button" onClick="test()" value=" 看看結果">  <p id="pp"></p>  </body>  </html>    運行此文件,可以看到效果 
copyright © 萬盛學電腦網 all rights reserved