关于for循环里面异步操作的问题

一、使用自执行函数

　　1、当自执行函数在循环当中使用时，自执行函数会在循环结束之后才会运行。比如你在自执行函数外面定义一个数组，在自执行函数当中给这个数组追加内容，你在自执行函数之外输出时，会发现这个数组当中仕么都没有，这就是因为自执行函数会在循环运行完后才会执行。

　　2、当自执行函数在循环当中使用时，要是自执行函数当中嵌套ajax，那么循环当中的下标i就不会传进ajax当中，需要在ajax外面把下标i赋值给一个变量，在ajax中直接调用这个变量就可以了。

　　例子：

$.ajax({
    type: "GET",
    dataType: "json",
    url: "***",
    success: function(data) {
        //console.log(data);               
        for (var i = 0; i < data.length; i++) {
            (function(i, abbreviation) {
                $.ajax({
                    type: "GET",
                    url: "/api/faults?abbreviation=" + encodeURI(abbreviation),
                    dataType: "json",
                    success: function(result) {
                        //获取数据后做的事情
                    }
                })
            })(i, data[i].abbreviation);
        }
    }
});

二、使用递归函数

所谓的递归函数就是在函数体内调用本函数。使用递归函数一定要注意，处理不当就会进入死循环。

const asyncDeal = (i) = > {
    if (i < 3) {
        $.get('/api/changeParts/change_part_standard?part=' + data[i].change_part_name, function(res) {
            //获取数据后做的事情
            i++;
            asyncDeal(i);
        })
    } else {
        //异步完成后做的事情
    }
};
asyncDeal(0);

三、使用async/await

async/await特点

1. async/await更加语义化，async 是“异步”的简写，async function 用于申明一个 function 是异步的； await，可以认为是async wait的简写， 用于等待一个异步方法执行完成；

2. async/await是一个用同步思维解决异步问题的方案（等结果出来之后，代码才会继续往下执行）

3. 可以通过多层 async function 的同步写法代替传统的callback嵌套

async function语法

• 自动将常规函数转换成Promise，返回值也是一个Promise对象

• 只有async函数内部的异步操作执行完，才会执行then方法指定的回调函数

• 异步函数内部可以使用await

await语法

• await 放置在Promise调用之前，await 强制后面点代码等待，直到Promise对象resolve，得到resolve的值作为await表达式的运算结果

• await只能在async函数内部使用,用在普通函数里就会报错

const asyncFunc = function(i) {
    return new Promise(function(resolve) {
        $.get(url, function(res) {
            resolve(res);
        })
    });
}
const asyncDeal = async function() {
    for (let i = 0; i < data.length; i++) {
        let res = await asyncFunc(i);
        //获取数据后做的事情
    }
}
asyncDeal();