promise处理数组里面的多任务,等所有任务处理完再执行后续逻辑

63 阅读1分钟

业务需求,有一个数组里面的数据,需要发送异步任务验证这里面的数据是否可用,然后再将可用的数据存储到本地,原本使用的方式是使用forEach遍历数组,然后在遍历中处理每一个异步函数,等处理完异步函数之后,再将可用的数据添加到一个新数组中。但是这样做就出现了问题:

        let enableItem = []        
        list.forEach(async (item) => {
            handleCheck(item) && enableItem.push(item)
        })
        setCheckedList(enableItem)
        await storage.set('platforms', enableItem)

因为forEach是异步执行的,并且handleCheck也是异步的,即便使用await handleCheck,外层的forEach还是异步的, 所以最后拿到的enableItem永远是一个空数组.......

需要改造为等所有的异步的handleCheck执行完,再调用本地存储函数:

        let enableItem = []
        let fnPromise = list.map((item) => {
            return handleCheck(item)
        })
        Promise.all(fnPromise).then((res) => {
            console.log('判断结果是', res)
            res.forEach((item, index) => {
                item && enableItem.push(list[index])
            })
            setCheckedList(enableItem)
            console.log('存储的platforms:', enableItem)
            storage.set('platforms', enableItem)
        })

这样最后就可以拿到完整的结果了