[Javascript] forEach()에 break 걸기

 
 
 

본래 Javascript에서 Array.forEach()는 break문을 따로 지원하지 않는다. 만약 일반 for문의 break 구문을 forEach에서 구현하고 싶다면 아래의 3가지 방법을 사용할 수 있다.
 

1. try... catch문 안에서 forEach를 실행하고 강제로 예외를 던져 루프를 벗어나는 방법
2. Array.some() 함수를 사용하는 방법
3. Array.every() 함수를 사용하는 방법

 

이들을 차례로 소개해 보려 한다.
 
 
 

1. try...catch 사용하기

forEach()에서는 return true를 하든 false를 하든 관계 없이 모두 continue로 작동된다. 따라서 return을 통해 break처리를 할 수는 없어 아예 예외 처리를 통해 강제로 반복문에서 벗어나는 방법을 사용한다.
 

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

try{
    arr.forEach(function(n){
        console.log(n);
        
        // 에러를 throw하면 강제로 반복문에서 벗어나 catch로 가게 됨
        if(n === 3) throw new Error('stop forEach()');  
    })
} catch(e){

}

// 결과: 1, 2, 3

 
 
 

2. Array.some()

some()은 forEach()와 같이 반복의 기능을 가진 함수로 return true는 break를, return false는 continue를 의미한다.

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

arr.some(function(n){
    console.log(n);
    if(n===3) 	return true;
    else	return false;
})

// 결과: 1, 2, 3

 
 
 
 

3. Array.every()

every() 또한 반복의 기능을 가진 함수로 some()과는 반대로 return true는 continue를, return false는 break를 의미한다.

let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

arr.every(function(n){
    console.log(n);
    if(n===3) 	return false;
    else	return true;
})

// 결과: 1, 2, 3

 
 
 
 

여기에 추가로 한 가지 방법이 더 있다. $.each()라는 jQuery의 메서드를 사용하는 것. 아래와 같이 return true는 continue로, return false는 break로 사용할 수 있다.

$('input').each(function(){
    if($(this).val() === ''){
        alert($(this).attr('name')+'의 값이 입력되지 않았습니다.');
        return false;  // break
    }
})