從 GitHub 擷取使用者
建立非同步函式 getUsers(names)
,取得 GitHub 登入陣列,從 GitHub 擷取使用者,並傳回 GitHub 使用者陣列。
給定 USERNAME
的 GitHub 使用者資訊網址為:https://api.github.com/users/USERNAME
。
沙盒中有一個測試範例。
重要事項
- 每個使用者應有一個
fetch
要求。 - 要求不應互相等待。這樣才能盡快收到資料。
- 如果任何要求失敗,或沒有該使用者,函式應在結果陣列中傳回
null
。
要取得使用者,我們需要:fetch('https://api.github.com/users/USERNAME')
。
如果回應的狀態為 200
,請呼叫 .json()
來讀取 JS 物件。
否則,如果 fetch
失敗,或回應的狀態非 200,我們只會在結果陣列中傳回 null
。
以下是程式碼
async function getUsers(names) {
let jobs = [];
for(let name of names) {
let job = fetch(`https://api.github.com/users/${name}`).then(
successResponse => {
if (successResponse.status != 200) {
return null;
} else {
return successResponse.json();
}
},
failResponse => {
return null;
}
);
jobs.push(job);
}
let results = await Promise.all(jobs);
return results;
}
請注意:.then
呼叫會直接附加到 fetch
,因此當我們有回應時,它不會等待其他 fetch
,而是立即開始讀取 .json()
。
如果我們使用 await Promise.all(names.map(name => fetch(...)))
,並在結果上呼叫 .json()
,則它會等待所有 fetch
回應。透過將 .json()
直接新增到每個 fetch
,我們確保個別 fetch
會開始讀取資料,而不會互相等待。
這是一個範例,說明即使我們主要使用 async/await
,低階 Promise API 仍然可能很有用。