Heim > Artikel > Web-Frontend > Async/Warten auf parallele Anfragen und Fehlerbehandlung
Dieser Artikel stellt hauptsächlich asynchrone/abwartende parallele Anforderungen und Fehlerbehandlung vor. Jetzt kann ich ihn mit allen teilen, die ihn benötigen
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 ') })()
Im obigen Code gehen wir davon aus, dass fetchName und fetchAvatar parallel ausgeführt werden, aber tatsächlich ist dies nicht der Fall. fetchAvatar wartet auf die Ausführung von fetchName, bevor die Anforderung gestartet wird. Die Ausführungszeit der fetchUser-Funktion beträgt nicht drei Sekunden, sondern 7 Sekunden
Wenn Sie parallele Anfragen stellen möchten, müssen Sie wie folgt schreiben: Die Ausführungszeit von fetchUserParallel beträgt 4 Sekunden
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 : ') })()
Verwenden Sie Promise.all, um gleichzeitige Anfragen zu stellen
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) }
/** * 包装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) }
Verwenden Sie weiterhin Catch
// 因为async 返回的promise对象,所以可以使用catch const user4 = await fetchUser(true).catch(err => { console.error('user4 error:', err) })
Das Obige ist der Der gesamte Inhalt dieses Artikels wird für das Lernen aller hilfreich sein. Weitere verwandte Inhalte finden Sie auf der PHP-Chinese-Website.
Verwandte Empfehlungen:
Knoten crawlt Lagou.com-Daten und exportiert sie als Excel-Datei Native JS basiert on window. scrollTo() kapselt die Funktion des vertikalen Scroll-Animationstools Ähnlichkeiten und Unterschiede zwischen Browsern und NodeJSs EventLoop und TeilmaschinenDas obige ist der detaillierte Inhalt vonAsync/Warten auf parallele Anfragen und Fehlerbehandlung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!