JavaScript 回调函数原理与实战用法解析

回调函数代码示例

function getdata(callback){
    //这里我们假设是从后端获取数据
    setTimeout(function(){
     //假设我们获取到数据info
     var info = {
      "id":1,
      "name":'张三'
     }
     //得到数据以后执行函数方法
     callback(info)//这个就是回调函数
    },1000)

getdata(check)
   function getdata(callback){
    //这里我们假设是从后端获取数据
    setTimeout(function(){
     //假设我们获取到数据info
     var info = {
      "id":1,
      "name":'张三'
     }
     //得到数据以后执行函数方法
     callback(info)//这个就是回调函数
    },1000)
 }
function check(data){
  if(data.id==1){
   console.log('验证成功，可以通过')
  }
}

Vue框架中的实际应用

//vue框架的应用，其他框架的可以自行修改！！！
//用户权限验证实例：
created(){//在这个钩子函数中取执行获取数据的方法，将验证方法作为回调传入
  getdata(check)
 }
 methods:{//在这里面，首先你得有created钩子函数中用到的那两个方法
   function getdata(callback){//向后端请求用户信息
    //这里我们假设是从后端获取数据
    setTimeout(function(){
     //假设我们获取到数据info
     var info = {
      "id":1,
      "name":'张三'
     }
     //得到数据以后执行函数方法
     callback(info)//这个就是回调函数，得到用户信息后去验证他的权限
    },1000)
 }
function check(data){//验证用户权限
  if(data.id==1){//验证权限的条件，根据实际设定
   console.log('验证成功，可以通过')//权限通过，可以做什么
  }else{
   console.log('验证失败，禁止通行')//没有权限，可以做什么
  }
}
 }