1. 程式人生 > 程式設計 >JavaScript回撥函式callback用法解析

JavaScript回撥函式callback用法解析

這篇文章主要介紹了JavaScript回撥函式callback用法解析,文中通過示例程式碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下

JavaScript回撥函式的使用是很常見的,引用官方回撥函式的定義:

A callback is a function that is passed as an argument to another function and is executed after its parent function has completed.

解釋得很明確,回撥函式就是作為引數傳遞給另一個函式並在其父函式完成後執行的函式。

聽起來似乎有點不好理解,所以還是舉例進行說明,介紹回撥函式之前先簡單說明一下同步和非同步,前端也有同步和非同步。同步和非同步總得來說,兩者最明顯的區別就是是否需要等待,如果是序列執行的就是同步機制,是並行執行的就是非同步機制,這個比較好理解

回撥函式的使用並沒有同步和非同步的區別,回撥函式只是一種特殊的函式,可以應用於同步呼叫場景,也可以應用於非同步呼叫場景

非同步請求中的回撥函式

最常用的有ajax非同步呼叫或者事件機制,例子:

$.get('${root}/saveOrUpdate.do',function(result){
      alert(result);
      }); 

同步請求中的回撥函式

業務場景:舉個例子,點選按鈕會觸發main函式,進行介面資料儲存(非同步方式),資料儲存成功之後,再回調開啟彈窗的函式

儲存資料函式:

function saveRecord(seq,callback){
  $.ajax({
      url:'${root}/saveOrUpdate.do',type:"post",async:true,success:function(result){
        //確保callback是一個函式型別的
        if(typeof(callback)==='function'){
            callback(true);
        }
      }
    }); 
}

main函式

//儲存成功,才會開啟彈窗
  function main(seq){
    saveRecord(seq,callbackFunction);
  }

回撥函式,資料儲存成功後再呼叫

/*儲存時的回撥函式*/
   function callbackFunction(saveSuccess){
    if(saveSuccess){
      //省略開啟彈窗程式碼
    }
   }

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支援我們。