本文實例講述了JavaScript callback回調函數(shù)用法。分享給大家供大家參考，具體如下：

在使用開源項目的時候經常會使用到回調函數(shù)，如果把回調函數(shù)弄清楚了，那么對我們深入了解開源項目會有很大幫助。

回調函數(shù)百度百科的解釋：

回調函數(shù)就是一個通過函數(shù)指針調用的函數(shù)。如果你把函數(shù)的指針（地址）作為參數(shù)傳遞給另一個函數(shù)，當這個指針被用來調用其所指向的函數(shù)時，我們就說這是回調函數(shù)。回調函數(shù)不是由該函數(shù)的實現(xiàn)方直接調用，而是在特定的事件或條件發(fā)生時由另外的一方調用的，用于對該事件或條件進行響應。

看上去不是那么容易理解，我們來看個例子（知乎）：

你到一個商店買東西，剛好你要的東西沒有貨，于是你在店員那里留下了你的電話，過了幾天店里有貨了，店員就打了你的電話，然后你接到電話后就到店里去取了貨。在這個例子里，你的電話號碼就叫回調函數(shù)，你把電話留給店員就叫登記回調函數(shù)，店里后來有貨了叫做觸發(fā)了回調關聯(lián)的事件，店員給你打電話叫做調用回調函數(shù)，你到店里去取貨叫做響應回調事件。

這樣好理解多了吧，當?shù)陠T被創(chuàng)建出來的時候，并不知道有誰會來商店里買東西，店員需要和很多不同的對象打交道，需要適配不同類型的對象，這個時候就需要回調函數(shù)了。

我們通過一個事例來理解一下回調函數(shù)的運用場景：

Me需要完成一個任務，計算1+1=？

Me如果要自己完成這個任務

代碼如下：

HTML 代碼

<div class="imgDiv">  <div class="search">    <input class="put" type="text" id="keyWord"/>    <ul id="tipList"></ul></div>

JavaScript 代碼

(function (){  $(function(){  $("#keyWord").on("keyup",function(event){    var keyCode = event.keyCode;    if(keyCode == 38|| keyCode ==40){      settingTipList(keyCode);      return false;    }    var keyWord = $(this).val();    getTipList(keyWord);  });  var index = -1;  function settingTipList(keyCode){    if(keyCode == 38){      index--;    }else{      index++;    }    var size = $("#tipList li").size();    index =index % size;    $("#tipList li").removeClass("active").eq(index).addClass("active");    var selectLiContent = $("#tipList li").eq(index).html();    $("#keyWord").val(selectLiContent);  };  //獲取數(shù)據  function getTipList(keyWord){    var url = "https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su";    var data = {      wd:keyWord,      cb:"hhh"    };    $.ajax({      url:url,      data:data,      type:"GET",      dataType:"jsonp",      jsonpCallback:"hhh",      success:function(data){        var tipList = data.s;        handleData(tipList)      },      error:function(error){        alert("接口出錯")      }    });  }  });  function handleData(tipList){    var tipHTML= "";    for(var i in tipList){      var text = tipList[i];      tipHTML += "<li>"+text+"</li>"    }    $("#tipList").css({"opacity":"1"});    $("#tipList").html(tipHTML);  }})()//如果不寫jsonpCallback、后面jsonpCallback“”空置、直接跳出“接口出錯了。