解决Ajax发送异步请求，js语句有不执行的坑

问题描述1：

最近遇到2个关于Ajax异步请求的坑：

• 1：自己定义的函数里面发送了post请求，需要回调函数的结果用作判断。如果post请求下面还有js语句，那么：回调函数还来不及执行，下面的语句就已经执行了。

---

案列：
自己写了一个判断验证码，先做前端校验，如果通过就去后台比较验证码，后台测试没有问题，最终结果始终以前端的校验为准，也就是说回调函数还没执行就直接 return 了。

/*校验验证码*/
function checkimgCode() {
    var imgCode = $("#imgCode").val();
    var reg_telephone= /^\w{4}$/;
    var flag = reg_telephone.test(imgCode);
    if(flag){
        //前端校验正确，去后端再校验
        $.post("user/checkimgCode",{imgCode:imgCode},function (data){
            if (data.flag){
                /*校验正确*/
                $(".errorMsg").css("visibility","hidden");
            } else{
                $(".errorMsg").css("visibility","visible");
                $(".errorMsg").html(data.errorMsg);
                flag = data.flag;
            }
        });
        return flag;
    /*前端校验没通过*/
    }else{
        $(".errorMsg").css("visibility","visible");
        $(".errorMsg").html("请输入4位有效验证码");
        return flag;
    }
}

解决办法：

在发送Ajax请求之前把Ajax设置为同步

$.ajaxSettings.async = false; //把ajax设置为同步

在执行完Ajax后再设置为异步

$.ajaxSettings.async = true; //ajax 设置为异步

---

问题2描述：

• 2：post请求发出后回调函数接收的是一个JSON数据，需要用遍历取出数据，所以我就用了一个for()

for (var i = 0;i <= data.list.length; i++){
   console.log(data.list.length);
}

很明显这是一条错误的语句（下标越界），但是它可不会给你报错，我的数据也正常的显示出来了，所以当时没有注意这个错误。

通过控制台打印发现集合长度只有12，却执行了13次。
如果你想在这个循环外面做一些操作，那么抱歉，根本就不会执行。所以还是要书写正确的条件判断：

for (var i = 0;i < data.list.length; i++){
   console.log(data.list.length);
}

如果条件正确，for循环外面的语句就可以正常执行了！

---

另外：循环中，尤其是以数组长度作为循环条件的，一定要小心一个陷阱，就是循环过程中对数组进行增删操作，很容易导致死循环或者执行次数不足，因为判断条件(数组长度)一直在变，所以不要在循环里对条件数组进行操作，或者不要以要被操作的数组长度做判断条件。