回调函数

时间：2021-01-29 11:50:08 收藏：0 阅读：0

回调函数也是函数，是应用场景比较特殊

回调函数：当一个函数被当做参数使用了

arr.forEach(function(){})

回调函数的优点：通常会放在异步的操作中，异步代码没有办法知道什么时候执行结束，在执行结束以后，需要执行另外一些操作

eg：回调函数

// 封装一个函数，实现延时的定时器的效果
function fn(callback,milliseconds){
    // 把当前时间存起来
    var time1 = +new Date();
    while(true){
        var date = +new Date()
        if(date === time1 + milliseconds){
            break;
        }
    }
    callback()
}

fn(function(){
    console.log(456);
},2000)

回调函数的使用场景：在某些异步操作执行完成以后，再执行一些同步代码

回调函数的缺点：嵌套多了会形成回调地狱

例如三级联动通过区查询到省代码就形成了回调地狱：

sendAjax({
    url:‘area.php‘,
    success:function(res){
        // console.log(res);
        var {meta:{status,msg},data} = res;

        if(status===0){
            // console.log(data.pid);
            var pid = data.pid;
            // 下一次请求只能写在这里
            // 通过市的id获取到省的id
            sendAjax({
                url:"city.php",
                data:{
                    pid
                },
                success(res){
                    // console.log(res);
                    var {meta:{status,msg},data} = res;
                    if(status===0){
                        // console.log(data.pid);
                        // 再次发送请求 - 通过省份id，获取到省份的名称
                        var id = data.pid;
                        sendAjax({
                            url:"province.php",
                            data:{id},
                            success:res=>{
                                // console.log(res);
                                var {meta:{status,msg},data} = res; 
                                if(status===0){
                                    console.log(data.name);
                                }
                            }
                        })
                    }
                }
            })
        }
    },
    // 选择请求方式：首先考虑是否需要传送数据
    // 需要传参 - 数据是否是敏感数据
    // 不算 - get就ok
    // 算 - post
    // 不需要传参 - get就ok
    data:{
        name:"包河区",
    }
})