Javascript - 链多个获取承诺
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Javascript - 链多个获取承诺相关的知识,希望对你有一定的参考价值。
我有这个方法执行3 window.fetch
const API_URL = 'http://localhost:3000/'
, API = {
'getArtistLyric': artist => {
return fetch(`${API_URL}artist?name=${artist}`)
.then(res => res.json())
.then(res => {
const artistID = JSON.parse(res).message.body.artist_list[0].artist.artist_id;
console.log('Artist ID is:', artistID);
fetch(`${API_URL}artist/albums/?artist_id=${artistID}`)
.then(resp => resp.json())
.then(resp => {
const trackID = JSON.parse(resp).message.body.album_list[0].album.album_id;
console.log('Random Track ID is:', trackID);
fetch(`${API_URL}artist/album/songsnippet?track_id=${trackID}`)
.then(response => response.json())
.then(response => {
const lyricSnippet = JSON.parse(response).message;
console.log('Track Id lyric snippet is:', lyricSnippet);
})
.catch(err => {
console.error(err);
});
})
.catch(err => {
console.error(err);
});
})
.catch(err => {
console.error(err);
});
}
}
现在我想这样称呼它
API.getArtistLyric('Prodigy').then(res).catch(err);
这里的最佳做法是什么?
答案
如果你想要一个链请求,最好使用async / await:
async func(){
let response = await /* some request */
let res = await /* another request */
...
return results;
}
在这里,您可以使用try / catch语法并包装特定请求:
try {
let response = await...
} catch ( exception) {
...
}
你也可以包含几个请求。
另一答案
(async() => {
const API_URL = 'http://localhost:3000/';
const API = {
getArtistLyric: async(artist) => {
try {
const res = await fetch(`${API_URL}artist?name=${artist}`);
const artistID = JSON.parse(res.json()).message.body.artist_list[0].artist.artist_id;
console.log('Artist ID is:', artistID);
const resp = await fetch(`${API_URL}artist/albums/?artist_id=${artistID}`);
const trackID = JSON.parse(resp.json()).message.body.album_list[0].album.album_id;
console.log('Random Track ID is:', trackID);
const response = await fetch(`${API_URL}artist/album/songsnippet?track_id=${trackID}`);
const lyricSnippet = JSON.parse(response.json()).message;
console.log('Track Id lyric snippet is:', lyricSnippet);
return lyricSnippet;
} catch (e) {
console.error(e);
}
}
}
try {
const art = await API.getArtistLyric('Prodigy');
console.log(art);
} catch (e ){
console.error(e);
}
})()
另一答案
看看有关链接承诺的链接:https://javascript.info/promise-chaining
这是核心理念:
它看起来像这样:
new Promise(function(resolve, reject) { setTimeout(() => resolve(1), 1000); // (*) }).then(function(result) { // (**) alert(result); // 1 return result * 2; }).then(function(result) { // (***) alert(result); // 2 return result * 2; }).then(function(result) { alert(result); // 4 return result * 2; });
这个想法是结果通过.then处理程序链传递。
这里的流程是:
初始承诺在1秒(*)内解析,然后调用.then处理程序(**)。价值
它返回传递给下一个.then处理程序(***)......依此类推。
以上是关于Javascript - 链多个获取承诺的主要内容,如果未能解决你的问题,请参考以下文章