✅ – Cooly – 23-00 Dec 24

await ref.recipes.forEach(async(doc) => {
await firebase.firestore().collection("recipes").doc(doc).get()
.then ((snap) => {
if (snap.exists) {
tempList.push(snap.data());
setDataList(tempList);
console.debug('first');
})
.catch((error) => {
alert(error.message);
})
})
}
console.debug('second');
await ref.recipes.forEach(async(doc) => {
await firebase.firestore().collection("recipes").doc(doc).get()
.then ((snap) => {
if (snap.exists) {
tempList.push(snap.data());
setDataList(tempList);
console.debug('first');
})
.catch((error) => {
alert(error.message);
})
})
}
console.debug('second');
how come "second" gets printed before "first" is there a way to make them print in the right order
S
ScriptyChris480d ago
@hide on tree and what's the problem/question with that code?
C
Cooly480d ago
i edited
S
ScriptyChris480d ago
Oh So this code is async, hence "second" is executed before "first" Hmm, wait - no, i misread your code, because of wrong indentation - it's the matter of .forEach Try Promise.all() + .map():
await Promise.all(ref.recipes.map((doc) => {
return firebase.firestore().collection("recipes").doc(doc).get()
.then((snap) => {
if (snap.exists) {
tempList.push(snap.data());
setDataList(tempList);
console.debug('first');
}
})
.catch((error) => {
alert(error.message);
})
})
}
console.debug('second');
await Promise.all(ref.recipes.map((doc) => {
return firebase.firestore().collection("recipes").doc(doc).get()
.then((snap) => {
if (snap.exists) {
tempList.push(snap.data());
setDataList(tempList);
console.debug('first');
}
})
.catch((error) => {
alert(error.message);
})
})
}
console.debug('second');
C
Cooly480d ago
ok let me try it worked tysm i was having problems with this for so long so with a for loop i should be using promise all?
UU
Unknown User480d ago
S
ScriptyChris480d ago
forEach returns undefined and it doesn't care about promises. map returns stuff you do inside it, so it returns a promise from each call back iteration - eventually map returns a new array of stuff returned from each of it's iterations. So that new array of promises is then resolved by Promise.all, which returns a promise (when it finishes resolving), which then is awaited, so the order of execution stays as you see it
C
Cooly480d ago
oh ok i got it
S
ScriptyChris480d ago
You can also use for..of loop, without Promise.all, because it doesn't use callbacks - it's just imperative, step by step iteration This should work too:
for (const doc of ref.recipes) {
await firebase.firestore().collection("recipes").doc(doc).get()
.then((snap) => {
if (snap.exists) {
tempList.push(snap.data());
setDataList(tempList);
console.debug('first');
}
})
.catch((error) => {
alert(error.message);
})
})
}
console.debug('second');
for (const doc of ref.recipes) {
await firebase.firestore().collection("recipes").doc(doc).get()
.then((snap) => {
if (snap.exists) {
tempList.push(snap.data());
setDataList(tempList);
console.debug('first');
}
})
.catch((error) => {
alert(error.message);
})
})
}
console.debug('second');
C
Cooly480d ago
@ScriptyChris sorry i have one more question is there a way to reverse it so start from the end and iterate to front nvm i got it
S
ScriptyChris480d ago
Just reverse the entrypoint array ref.recipes.reverse()? !mdn Array.reverse
UU
Unknown User480d ago
C
Cooly480d ago
yep i got it lol dumb question
UU
Unknown User480d ago