解決 for循環異步請求 導致異步請求內部的代碼 不按順序執行的問題

1.問題原因

let data = [1,2,3,4,5];

for(i=0;i<data.length;i++){
    let d = data[i];
    $.get("getById?id="+d,function(data){
        console.log(i)
    })
    //一次循環結束
}
//[0,3,2,4,1]

因爲for循環 是在每次循環的代碼塊最後一行執行完成時,判斷是否進入下一次循環,

並且異步請求因爲網速問題,請求完成時間不同

2.如何解決

知道了問題,解決起來就簡單了,

只需要改變for循環判斷的結束的位置,爲每次循環的異步請求結束時,再進行下一次的循環

利用遞歸調用可以很好的解決這個問題

let data = [1,2,3,4,5];

getData(0,data.length)
function getData(i,length){
    let d = data[i];
    $.get("getById?id="+d,function(data){
        
        console.log(i)
        //改變循環結束的位置,爲請求完成時
        if(++i<length){
            getData(i,length)
        }
    })

}

//[0,1,2,3,4]