鍍金池/ 問答/Linux  HTML/ 請問在foreach里面進行異步操作，怎么返回異步操作后的數(shù)據(jù)？

請問在foreach里面進行異步操作，怎么返回異步操作后的數(shù)據(jù)？

代碼如下:

function longTimeDo() {
    let data = [];
    let sourse = [1,2,3,4,5];
    sourse.forEach(value=>{
        setTimeout(()=>{
            data.push(value);
        },1000);
    });
    //?怎么返回這個異步完成的data
}
回答
編輯回答
維他命

你可以用Promise.all或者for of加async/await。

function pushData(arr, value) {
    return new Promise((reslove) => {
        setTimeout(() => {
            arr.push(value);
            console.log('push data over', value)
            reslove();
        }, 1000);
    })
}

async function longTimeDo() {
    let data = [];
    let sourse = [1, 2, 3, 4, 5];

    for (let value of sourse) {
        await pushData(data, value);
    }

    console.log(data)

}

longTimeDo();
2017年8月18日 10:06
編輯回答
愛是癌

最low的辦法是加個計數(shù)，num=0;settimeout一次就加1，判斷當num==source.length的時候再return data

2017年2月4日 14:23
編輯回答
傲寒

這樣是不行的哦:

function longTimeDo() {
    let data = [];
    let sourse = [1,2,3,4,5];
    sourse.forEach(value => {
        console.log('forEach-star')
        setTimeout(() => {
            data.push(value);
            console.log('forEach-async')
        }, 1000);
        console.log('forEach-end')
    });
    console.log('longTimeDo-end');
}
longTimeDo();

輸出結(jié)果為
clipboard.png

從結(jié)果可以看到, 在循環(huán)中的異步只是會在循環(huán)中作用, 而不能影響循環(huán)外部. 如果你想讓這個函數(shù)返回 異步后的結(jié)果的話 就相當于異步改同步, 就要用到Primise了

async function longTimeDo () {
    let data = [];
    let sourse = [1,2,3,4,5];
    let allP = sourse.map(value => {
        return new Promise((res, rej) => {
            setTimeout(() => {
                data.push(value+1);
                res(data)
            }, 1000);
        });
    });
    await Promise.all(allP);

    return data;
}
longTimeDo().then(res => {
    log(res) // [2, 3, 4, 5, 6]
})
2017年2月6日 12:33