Explain JavaScript code

What this JavaScript sample shows

promises

fetch returns a promise for each id, and Promise.allSettled waits until every one has either resolved or rejected. It never rejects itself, so one failed user doesn't lose the others.

event loop

The script prints before, then after, and only then the count. await pauses loadProfiles and hands control back, so the last console.log runs while the requests are still in flight.

closures

The arrow function inside ids.map closes over its own id, so each error message names the right user even though the requests can finish in any order.

Good to know

• All the requests start at once, because map calls fetch for every id before anything is awaited. To send them one at a time, await each one inside a for...of loop.
• fetch only rejects when the request itself fails, such as a network error. A 404 or a 500 still resolves, which is why the code checks res.ok and throws.
• With Promise.all instead, the first failure would reject the whole call and the profiles that did load would be lost.
• results keeps the same order as ids, which is why ids[i] finds the id of a failed request.

Watch out: A relative URL like /api/users/1 only works in a web page. In Node.js, fetch needs a full URL, so every request here would fail with Failed to parse URL and end up in failed.