Home > Article > Web Front-end > async/await parallel requests and error handling
This article mainly introduces about async/await parallel requests and error handling, which has certain reference value. Now I share it with everyone. Friends in need can refer to it
When using async, the order of code execution is easy to make mistakes. For example, if we want to initiate two requests at the same time, we may write the following code
function fetchName () { return new Promise((resolve, reject) => { setTimeout(() => { resolve('lujs') }, 3000) }) } function fetchAvatar () { return new Promise((resolve, reject) => { setTimeout(() => { resolve('https://avatars3.githubusercontent.com/u/16317354?s=88&v=4') }, 4000) }) } async fetchUser () { const name = await fetchName() const avatar = await fetchAvatar() return { name, avatar } } (async function () { console.time('should be 7s ') const user = await fetchUser() console.log(user) console.timeEnd('should be 3s ') })()
In the above code , we think that fetchName, fetchAvatar will be executed in parallel, but in fact they will not. fetchAvatar will wait for fetchName to be executed before starting the request. The execution time of the fetchUser function is not three seconds but 7 seconds.
If you want to make parallel requests, you need to write as follows. The execution time of fetchUserParallel is 4 seconds.
async function fetchUserParallel () { const namePromise = fetchName() const avatarPromise = fetchAvatar() return { name: await namePromise, avatar: await avatarPromise } } (async function () { console.time('should be 3s, but time is ') const user = await fetchUser() console.log(user) console.timeEnd('should be 3s, but time is ') console.time('should be 3s : ') const user2 = await fetchUserParallel() console.log(user2) console.timeEnd('should be 3s : ') })()
function fetchList (id) { return new Promise((resolve, reject) => { setTimeout(() => { resolve(`id is : ${id}`) }, 5000) }) } async function getList () { const ary = [1, 2, 3, 4] const list = Promise.all( ary.map( (id) => fetchList(id))) return await list } (async function () { // 使用promise并发请求 console.time('should be 3s ') const list = await getList() console.log(list) console.timeEnd('should be 3s ') })()
try { const user3 = await fetchUser(true) } catch (err) { console.error('user3 error:', err) }
Reference article
/** * 包装promise, 使其返回统一的错误格式 * @param {Promise} promise */ function to (promise) { return promise.then(res => [null, res]).catch(err => [err]) } . . . const [err, res] = await to(fetchUser(true)) if (err) { console.error('touser err:', err) }
// 因为async 返回的promise对象,所以可以使用catch const user4 = await fetchUser(true).catch(err => { console.error('user4 error:', err) })
If you are interested, you can run the code.
Test code
The above is the entire content of this article. I hope it will be helpful to everyone's learning. , please pay attention to the PHP Chinese website for more related content!
Related recommendations:
node crawls Lagou.com data and exports it as an excel file
Native JS is based on window. scrollTo() encapsulates the vertical scrolling animation tool function
## Similarities and differences between browsers and NodeJS’s EventLoop and partial machines
The above is the detailed content of async/await parallel requests and error handling. For more information, please follow other related articles on the PHP Chinese website!