🚀 자바스크립트 forEach() 에 break 거는 방법

자바스크립트 break

Array.forEach() 는 기본적으로 break 문을 따로 지원하지 않는다.

만일 일반 for문의 break 구문을 forEach에 구현하고 싶다면 다음 3가지 방법이 존재한다.

1. try catch문 안에서 forEach를 돌리고, 강제 throw에러로 루프를 벗어나는 방법
2. Array.some() 메소드를 쓰는 방법
3. Array.every() 메소드를 쓰는 방법

 

try catch

- forEach는 return true / false 둘 다 continue로 작동된다.

- forEach 자체의 return은 undefined 이다.

- 따라서 리턴으로 break를 걸수가 없어 아예 예외처리를 통해서 예외를 throw하여 강제로 루프문을 벗어나게 하는 방법을 쓴다.

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

try{
  arr.forEach(function(c){
    console.log(c);
    if(c==3)
      throw new Error("stop loop"); // 에러를 throw하면 강제로 루프에서 벗어나서 catch로 가게 된다.
  })
}catch(e){
 
}

// 결과 : 1, 2, 3

---

some() 메소드

- forEach()같이 순회하는 메소드 (순회하며 따로 기능이 있는 메소드이지만, 이 강좌에선 다루지 않는다.)

- return true 는 break

- return false 는 continue

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

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

// 결과 : 1, 2, 3

---

every() 메소드

- forEach()같이 순회하는 메소드 (순회하며 따로 기능이 있는 메소드이지만, 이 강좌에선 다루지 않는다.)

- return true 는 continue

- return false 는 break

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

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

// 결과 : 1, 2, 3

---

$each() 제이쿼리 메소드

- jQuery의 forEach버젼

- return true 는 continue

- return false 는 break

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