[JavaScript] forEach는 멈추지 않아!

forEach가 어떤건지 다들 아실거라 생각하고 ㅎㅎ;;
바로 본론으로 ~

준비

const numbers = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
const result = [];

numbers의 요소들을 result에 집어넣을겁니다!
물론 forEach를 사용해서 말이죠!

without async/await

numbers.forEach((number) => {
    result.push(number);
});

result -> [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

값이 아주 잘 들어가는군요 !

하지만 만약 이렇게 한다면 어떻게 될까요?!

async/await

async function getNumber (num) {
    return num;
}

numbers.forEach(async num => {
    const num2 = await getNumber(num);
    result.push(num2);
});

result -> []

아무것도 들어가지 않습니다 ㅜㅠ

why?

그 이유는 forEach는 불도저같은 놈이라 에러가 발생하는게 아니면 절대 멈추지 않습니다. 그게 await라고 해도 말이죠...

예외를 던지지 않고는 forEach()를 중간에 멈출 수 없습니다.
중간에 멈춰야 한다면 forEach()가 적절한 방법이 아닐지도 모릅니다.
-MDN-

그러니 forEach문 안에 await를 썼는데 왜 값이 안들어오지?! 라고 울지 말아요...
네...제 얘기입니다 ㅜㅠ

참고문서

• forEach_MDN