Click here to Skip to main content
15,878,814 members
Home / Discussions / JavaScript
   

JavaScript

 
Question[Learning/Beginner] Confused about await, async and fetch. Pin
Maximilien2-May-23 3:09
Maximilien2-May-23 3:09 
AnswerRe: [Learning/Beginner] Confused about await, async and fetch. Pin
Jeremy Falcon2-May-23 5:07
professionalJeremy Falcon2-May-23 5:07 
GeneralRe: [Learning/Beginner] Confused about await, async and fetch. Pin
Maximilien2-May-23 10:27
Maximilien2-May-23 10:27 
AnswerRe: [Learning/Beginner] Confused about await, async and fetch. Pin
Richard Deeming2-May-23 22:33
mveRichard Deeming2-May-23 22:33 
GeneralRe: [Learning/Beginner] Confused about await, async and fetch. Pin
Maximilien3-May-23 2:41
Maximilien3-May-23 2:41 
GeneralRe: [Learning/Beginner] Confused about await, async and fetch. Pin
Jeremy Falcon3-May-23 10:13
professionalJeremy Falcon3-May-23 10:13 
GeneralRe: [Learning/Beginner] Confused about await, async and fetch. Pin
Maximilien3-May-23 12:56
Maximilien3-May-23 12:56 
GeneralRe: [Learning/Beginner] Confused about await, async and fetch. Pin
Jeremy Falcon4-May-23 4:47
professionalJeremy Falcon4-May-23 4:47 
Richard is spot on with his reply. Mine was more theory. Take it as a compliment. Sometimes I just chat theory when I recognize the poster because I trust they take it and run with it. It's still the same principle, but just needs to be called from within the context of an Array.prototype.map callback. There are a couple ways to go about this.

1 You can still use an async IIFE anyway. IIFE is a functional/JavaScript concept that stands for Immediately-Invoked Function Expression and is pronounced iffy. It does exactly what it says and can be put anywhere. It's a quick and dirty way to call async code from a sync routine as well.

2 You can make the map callback itself async. However, this means you'd also have to deal with sync/async issue still.... just "one level" higher so to speak. Array.prototype.map iterates, much like IEnumerable in C#. In JavaScript, async/await is essentially syntax sugar for promises. Makes life easier and for cleaner code. But it also means you can interchange them and loop through your nested map like this:
JavaScript
// this level needs a promise.all too
results.map(async person => {
  // loop all films for each person
  await Promise.all(arr.map(async filmURL => {
    const filmName = await getFilmName(filmURL);
  }));
};
Keep in mind though, this simply shifts the requirement for async up one nested level. The parent map would still have to be called within the context of a promise or async/await still. Same exact syntax. Keep in mind though, using Promise.all is old. It works, but no cool points for using it.

As a side note, this is mainly for educational purposes. An API shouldn't be called in a loop. Redesigning the API, using GraphQL, streaming the data, etc. should all be considerations to rethink the approach of opening web requests in a loop.

Buttttt.... if you need a loop-like concept, you'd be better off with generators. For example, if you used generators, you'd be able to pull off something like this. Just trying to whet your appetite. Smile | :)
JavaScript
for await (const filmName of getFilmNames()) {
  // so fancy and clean
}

Anywho, the super short answer is just go with #2 and don't forget to use promise.all on the outer nest too. Laugh | :laugh:
Jeremy Falcon

QuestionAxios Pin
darlina1-May-23 22:47
darlina1-May-23 22:47 
Questionjson and json-server with weird be valid json file. Pin
Maximilien21-Apr-23 2:17
Maximilien21-Apr-23 2:17 
AnswerRe: json and json-server with weird be valid json file. Pin
Richard Deeming21-Apr-23 2:32
mveRichard Deeming21-Apr-23 2:32 
GeneralRe: json and json-server with weird be valid json file. Pin
Maximilien21-Apr-23 4:15
Maximilien21-Apr-23 4:15 
GeneralRe: json and json-server with weird be valid json file. Pin
Richard Deeming21-Apr-23 5:37
mveRichard Deeming21-Apr-23 5:37 
QuestionApplication is "dead" when I open it in a browser Pin
arnold_w16-Mar-23 23:23
arnold_w16-Mar-23 23:23 
AnswerRe: Application is "dead" when I open it in a browser Pin
jschell5-Apr-23 6:30
jschell5-Apr-23 6:30 
QuestionJavascript Form Validation - Help needed Pin
Kobraz11-Mar-23 12:43
Kobraz11-Mar-23 12:43 
QuestionJavaScript Pin
Member 159403612-Mar-23 17:42
Member 159403612-Mar-23 17:42 
RantRe: JavaScript Pin
Richard Deeming2-Mar-23 21:24
mveRichard Deeming2-Mar-23 21:24 
JokeRe: JavaScript Pin
Jeremy Falcon8-Mar-23 12:57
professionalJeremy Falcon8-Mar-23 12:57 
SuggestionJavaScript Pin
Member 159403612-Mar-23 17:40
Member 159403612-Mar-23 17:40 
RantRe: JavaScript Pin
Richard Deeming2-Mar-23 21:24
mveRichard Deeming2-Mar-23 21:24 
GeneralRe: JavaScript Pin
jschell10-Mar-23 11:07
jschell10-Mar-23 11:07 
QuestionDisable a textbox inside Repeater control when any of the DropDownList values also inside Repeater, is selected Pin
Ihechi Alozie2-Mar-23 12:17
Ihechi Alozie2-Mar-23 12:17 
AnswerRe: Disable a textbox inside Repeater control when any of the DropDownList values also inside Repeater, is selected Pin
Richard Deeming2-Mar-23 21:27
mveRichard Deeming2-Mar-23 21:27 
QuestionHow to replace the select of my html Pin
sanphil2-Mar-23 1:07
sanphil2-Mar-23 1:07 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.