淺析JS中回調(diào)函數(shù)及用法

更新時間：2018年07月25日 10:23:52 作者：陳健兒

這篇文章主要介紹了JS中回調(diào)函數(shù)及用法，通過實例代碼給大家詳細介紹了什么是回調(diào)函數(shù)，非常不錯，具有一定的參考借鑒價值，需要的朋友參考下吧

回調(diào)函數(shù)，什么是回調(diào)函數(shù)呢？很多初學(xué)者都不是很明白，感覺懵懵的，不理解，更不會用！

其實簡單理解的話就是在一個函數(shù)執(zhí)行完畢后，得到想要的特定數(shù)據(jù)后在去執(zhí)行的函數(shù)，并沒有性藥中的那么高深！

function getdata(callback){
    //這里我們假設(shè)是從后端獲取數(shù)據(jù)
    setTimeout(function(){
     //假設(shè)我們獲取到數(shù)據(jù)info
     var info = {
      "id":1,
      "name":'張三'
     }
     //得到數(shù)據(jù)以后執(zhí)行函數(shù)方法
     callback(info)//這個就是回調(diào)函數(shù)
    },1000)

上述代碼就可以清除的告訴你什么是回調(diào)函數(shù)！可能你還是不太明白，這個callback是什么，他有什么作用呢？

getdata(check)
   function getdata(callback){
    //這里我們假設(shè)是從后端獲取數(shù)據(jù)
    setTimeout(function(){
     //假設(shè)我們獲取到數(shù)據(jù)info
     var info = {
      "id":1,
      "name":'張三'
     }
     //得到數(shù)據(jù)以后執(zhí)行函數(shù)方法
     callback(info)//這個就是回調(diào)函數(shù)
    },1000)
 }
function check(data){
  if(data.id==1){
   console.log('驗證成功，可以通過')
  }
}

看上面的代碼，有兩個方法，getdata和check，我們執(zhí)行了getdata方法，并把check當(dāng)做參數(shù)傳給了getdata，那么這時候check就是回調(diào)函數(shù)！

那么這個回調(diào)函數(shù)有什么作用呢，怎么用呢？如果你已經(jīng)理解了回調(diào)函數(shù)的意義，那么你將很好的理解他的用法，記憶怎么在實際項目中去用他！

看下面的代碼，我寫的一種實際應(yīng)用中的用法：

//vue框架的應(yīng)用，其他框架的可以自行修改?。?！
//用戶權(quán)限驗證實例：
created(){//在這個鉤子函數(shù)中取執(zhí)行獲取數(shù)據(jù)的方法，將驗證方法作為回調(diào)傳入
  getdata(check)
 }
 methods:{//在這里面，首先你得有created鉤子函數(shù)中用到的那兩個方法
   function getdata(callback){//向后端請求用戶信息
    //這里我們假設(shè)是從后端獲取數(shù)據(jù)
    setTimeout(function(){
     //假設(shè)我們獲取到數(shù)據(jù)info
     var info = {
      "id":1,
      "name":'張三'
     }
     //得到數(shù)據(jù)以后執(zhí)行函數(shù)方法
     callback(info)//這個就是回調(diào)函數(shù)，得到用戶信息后去驗證他的權(quán)限
    },1000)
 }
function check(data){//驗證用戶權(quán)限
  if(data.id==1){//驗證權(quán)限的條件，根據(jù)實際設(shè)定
   console.log('驗證成功，可以通過')//權(quán)限通過，可以做什么
  }else{
   console.log('驗證失敗，禁止通行')//沒有權(quán)限，可以做什么
  }
}
 }

總結(jié)

以上所述是小編給大家介紹的JS中回調(diào)函數(shù)及用法，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

您可能感興趣的文章: