JavaScript forEach() 반복문을 중간에 종료하는 방법 총정리

JavaScript의 forEach() 메서드는 배열의 각 요소를 순회할 때 매우 유용하지만, 한 가지 큰 제약이 있습니다. 바로 break 문이나 continue 문을 사용할 수 없다는 점입니다. 일반적인 for 반복문과 달리 forEach()는 조기에 루프를 탈출하는 기능을 기본적으로 제공하지 않습니다.

forEach()에서 break를 사용할 수 없는 이유

forEach()는 각 배열 요소에 대해 콜백 함수를 실행하는 고차 함수(Higher-Order Function)입니다. 콜백 함수 내부에서 break를 사용하면 문법 오류가 발생하며, return을 사용해도 해당 콜백만 종료될 뿐 전체 순회가 멈추지 않습니다.

따라서 루프를 중간에 종료해야 하는 상황이라면 아래에서 소개하는 대안적인 방법을 사용하는 것이 좋습니다.

방법 1: Lodash의 _.find() 활용하기

Lodash 라이브러리를 사용하고 있다면 _.find 메서드가 좋은 대안이 됩니다. 이 메서드는 조건에 맞는 요소를 찾는 즉시 루프를 중단하므로 불필요한 순회를 피할 수 있습니다.

예제 코드

_.find([1, 2, 3, 4], (element) => {
    // 여기서 조건을 확인합니다
    if (element === 2) {
        return true;
    }
    // 요소를 원하는 대로 처리합니다
    // ...
});

위 예제에서 요소 값이 2인 지점을 만나면 true를 반환하고 루프가 즉시 종료됩니다.

방법 2: 예외(Exception)를 던져 종료하기

외부 라이브러리를 사용할 수 없는 상황이라면 try...catch 구문과 함께 예외를 발생시키는 방식으로 forEach()를 강제로 종료할 수 있습니다.

예제 코드

try {
    [1, 2, 3, 4].forEach((element) => {
        // 여기서 조건을 확인합니다
        if (element === 2) {
            throw new Error();
        }
        // 요소를 원하는 대로 처리합니다
        // ...
    })
} catch (e) {
    // 아무 작업도 수행하지 않습니다.
}

더 나은 대안: some(), every(), for...of

사실 예외를 이용한 루프 탈출은 코드 가독성과 성능 면에서 권장되지 않습니다. 다음과 같은 네이티브 JavaScript 문법을 고려해 보세요.

• Array.prototype.some(): 콜백이 true를 반환하면 순회를 중단합니다.
• Array.prototype.every(): 콜백이 false를 반환하면 순회를 중단합니다.
• for...of 문: break와 continue를 자유롭게 사용할 수 있습니다.

for...of 예제

for (const element of [1, 2, 3, 4]) {
    if (element === 2) {
        break; // 자유롭게 루프 탈출 가능
    }
    console.log(element);
}

정리

forEach()는 의도적으로 break를 지원하지 않도록 설계된 메서드입니다. 조건에 따라 루프를 조기 종료해야 한다면 _.find, some(), every() 또는 전통적인 for/for...of 반복문을 사용하는 것이 가장 깔끔하고 효율적인 해결책입니다.