JavaScript에서 forEach 루프 계속하기

이 튜토리얼은 JavaScript에서 forEach 루프를 계속하는 방법을 알려줍니다.

JavaScript에서 forEach 루프 계속하기

forEach 루프는 배열의 모든 항목에 대해 사용자 지정 콜백 함수를 수행하는 JavaScript 배열 메서드입니다. 어레이에서만 forEach 루프를 활용할 수 있습니다.

forEach 루프 예제부터 시작하겠습니다.

5~10개의 숫자가 포함된 숫자 배열이 있다고 가정합니다. forEach 루프를 사용하여 값을 어떻게 인쇄합니까?

아래 데모를 참조하십시오.

const numb = [5, 6, 7, 8, 9, 10];

numb.forEach((num) => {
  console.log(num);
});

실행 코드

출력:

5,6,7,8,9,10

다른 일을 하고 싶다고 가정해 보십시오. 짝수인 numb 배열의 항목을 건너뛰고 싶습니다. 이것을 어떻게 성취할 것인가?

해당 루프에서 계속을 추가합니다. 그러나 forEach 루프에서 continue를 사용하면 문제가 발생합니다.

문제부터 시작하겠습니다.

const numb = [5, 6, 7, 8, 9, 10]

numb.forEach(num => {
  if (num % 2 === 0) {
    continue;
  }
})

실행 코드

출력:

Uncaught SyntaxError: Illegal continue statement: no surrounding iteration statement

보시다시피 JavaScript forEach 루프 내의 continue 문은 Uncaught SyntaxError를 발생시킵니다. 따라서 return 문이 더 나은 대안입니다.

forEach 루프가 루프보다 함수처럼 동작하기 때문에 구문 오류가 발생했습니다. 그렇기 때문에 계속해서 공연을 할 수 없습니다.

그러나 forEach 루프에서 continue를 사용해야 하는 경우 옵션이 있습니다. return을 사용하여 forEach 루프를 종료할 수 있습니다.

아래 코드를 살펴보십시오.

const numb = [5, 6, 7, 8, 9, 10];

numb.forEach((num) => {
  if (num % 2 === 0) {
    return;
  }
  console.log(num);
});

실행 코드

출력:

5,7,9

필요한 출력을 얻기 위해 return을 사용할 수 있지만 더 효율적인 방법이 있습니다. filter() 기능을 사용하여 원하지 않는 값을 쉽게 제거할 수 있습니다.

예:

const numb = [5, 6, 7, 8, 9, 10];

numb.filter((num) => num % 2 !== 0).forEach((num) => {
  console.log(num);
});

출력:

5,7,9

결론

이 기사를 결론짓기 위해 forEach 루프 내에서 continue 문을 직접 사용할 수 없습니다. 대신 return 문이 이상적인 솔루션입니다.

return 문을 사용할 수 없는 경우 forEach 루프를 for 또는 while 루프로 대체하여 continue 문을 사용해야 합니다.