1

I'm implementing some function in which retrieves some data of type array from firebase, then search for specific element from that array and if exists, I would like to abort the function and return back to the caller. (React-native app)

here is the Code: 

ref.get().then(snapshot => { const personArr = snapshot.data().winPerson; ... if (personArr != undefined) { personArr.forEach(item => { if (item == uid.uid) { alert(`already subscribed`); return; } }); if (prop.first.length != 0) { uploadHelper(ref, prop, "first"); } ... } });

I loop through the array using forEach and see if there is matching element. If there is match, then it should alert and return to the caller function without running the subsequent code below, which is 

if (prop.first.length != 0) { uploadHelper(ref, prop, "first"); }

However, assuming that the element does exist in the array, the code runs both alert and the uploadHelper function(checked through log). First I thought forEach was async function so uploadHelper executed before the return; however, forEach is not async function (after some googling).

I have no idea why uploadHelper runs if the code falls into the if (item == uid.uid) condition and returns.

any help is appreciated. Thank you

Improve this question
0

4 Answers 4

Reset to default
2

It is returning to the caller function :) a forEach() is calling a function with each element. So you are returning, but only from the function of that one element.

I think a for of loop would be want you want here. People who want to do functional programming want to use the .forEach, but using a for of achieves the same functional effect as a .forEach (don't have to index, no side effect) and is probably more straightforward to use. (a forEach also has an issue if wanting to write async code where you would like to wait between each element)

So, rewrite your code like:

for (const item of personArr) { if (item == uid.uid) { alert(`already subscribed`); return; } }
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

1

The forEach handler is also a function. ( item => ... is an arrow function ) So returning from inside personArr.forEach() does not actually stop the rest of the function from executing.

So if (prop.first.length != 0) will get checked, no matter what the .forEach() does.

If the goal is to only run uploadHelper when uid is not found, you need to change the structure a little bit. Something like:

ref.get().then(snapshot => { const personArr = snapshot.data().winPerson; ... if (personArr != undefined) { const match = personArr.find( item => item === uid.uid ); if ( match ) alert(`already subscribed`); else if (prop.first.length != 0) { uploadHelper(ref, prop, "first"); } // else { /* some other defualt case ? */ ... } });

If item is actually the same value as uid.uid, you can even do it simpler:

personArr.includes( uid.uid ) should return true, if uid.uid is inside personArr.

Improve this answer

1 Comment

many satisfying answer, thank you very much! got the concept now.
1

First of all, you can't stop a forEach. It will always run for every element of the array and then continue the execution of the code. The return indicates that the element you are iteration on at the moment will be changed for your return value.

If you want to stop the execution you could use a for-in loop or a generic for loop.

Improve this answer

5 Comments

Or just .find() instead of .forEach() if you need to find one exact element.
Not strictly true...if an exception is thrown inside the forEach it will break :)
True, but an exception will stop the execution without a try / catch. For the use case was not necessary :D
Wow thanks didn't know that. The part you said about the return statement in forEach, does that apply to only forEach or all of for, for in loops?
@hyuklee it applies to .forEach, .map, .reduce,... just to give some examples. Check MDN to get some examples. Regular for for-in loops will work as usual.
1

Use this instead

for (let item of personArr) { if (item == uid.uid) { alert(`already subscribed`); break; } }

forEach is not possible to break, thats why you need to use for instead and break it. in forEach return means continue to next index without processing below code not stop the loop

Improve this answer

2 Comments

Thanks new knowledge of forEach. Though, if I use break it will only get out of the for loop and execute the subsequent code wouldn't it? can i use return in for in instead of break?
@hyuklee No, you can't use return, because the function gets called for each array element, and return in this case will behave like continue inside a for: it stops the current execution, but doesn't stop the iteration itself.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.