[JavaScirpt][TIL] break문 , continue문

Trippy·2023년 10월 25일
1

JavaScript

목록 보기
14/28
post-thumbnail

break 문

break문은 코드 블록을 탈출한다, 좀 더 정확히 표현하자면 코드 블록을 탈출하는 것이 아니라 레이블 문, 반복문(for, for...in, for...of, while, do...while) 또는 switch문의 코드 블록을 탈출한다. 레이블 문, 반복문, switch 문의 코드 블록 외에 break 문을 사용하면 SyntaxError(문법 에러)가 발생한다.

if (true) {
break; // Uncaught SyntaxError: illegal break statement
} 

참고로 레이블 문은 식별자가 붙은 문을 말한다.

foo: console.log('foo'); // foo라는 식별자가 붙은 레이블 문
// foo라는 식별자가 붙은 레이블 블록문
foo: {
  console.log(1);
  break foo; // foo 레이블 블록문을 탈출한다.
  console.log(2);
}

console.log('Done!');

중첩된 for문의 내부 for문에서 break문을 실행하면 내부 for문을 탈출하여 외부 for문으로 진입한다, 이때 for문이 아닌 외부 for문을 탈출하려면 레이블 문을 사용한다.

// outer라는 식별자가 붙은 레이블 for문ㅇ
outer: for(var i = 0; i < 3; i++) {
  for(var j =0; j < 3; j++) {
    // i + j === 3이면 outer라는 식별자가 붙은 레이블 for문을 탈출한다.
    if(i + j === 3) break outer;
    console.log(`inner [${i}, ${j}]`);
  }
}
console.log('Done!');

중첩된 for문을 외부로 탈출할 때 유용하지만 그 밖의 경우는 일반적으로 권장하지 않는다


break문은 레이블 문뿐 아니라 반복문,switc문에서도 사용할 수 있다. 이 경우에는 break 문에 레이블 식별자를 지정하지 않는다. break 문은 반복문을 더 이상 진행하지 않아도 될 때 불필요한 반복을 회피할 수 있어 유용하다.

다음은 문자열에서 특정 문자의 인덱스를 검색하는 예다.

var string = 'Hello, World';
var search = 'l';
var index;

// 문자열은 유사 배열이므로 for 문으로 순회할 수 있다.
for(var i =0; i < string.length; i++) {
  // 문자열의 개별 문자가 'l'이면
  if (string[i] === search) {
    index = i;
    break; // 반복문을 탈출한다.
  }
}

console.log(index); // 2
// 참고로 string.prototype.indexOf 메서드를 이용해도 같은 동작을 한다.
console.log(string.indexOf(search)); // 2

Continue 문

continue문은 반복문의 코드 블록 실행을 현 지점에서 중단하고 반복문의 증감식으로 실행 흐름을 이동시킨다. break문처럼 반복문을 탈출하지는 않는다.

다음은 문자열에서 특정 문자의 개수를 세는 예다.

var string = 'Hello, World';
var search = 'l';
var count = 0;

// 문자열은 유사 배열이므로 for 문으로 순회할 수 있다.
for (var i = 0; i < string.length; i++) {
  // 'l'이 아니면 현 지점에서 실행을 중단하고 반복문의 증감식으로 이동한다.
 if (string[i] !== search) continue;
count ++; // continue 문이 실행되면 이 문은 실행되지 않는다
}

console.log(count); // 3

// 참고로 Stirng.prototype.match 메서드를 사용해도 같은 동작을 한다.
const regxp = new Regxp(search, 'g');
console.log(string.match(regxp).length); // 3

위 예제의 for문은 다음 코드와 동일하게 동작한다.

for (var i = 0; i < string.length; i++) {
  // 'l'이면 카운트를 증가시킨다.
  if (string[i] === search) count ++;
}
```
실행해야 할 코드가 한 줄이라면 continue문을 사용했을 때보다 간편하고 가독성도 좋다.
하지만 if문 내에서 실행해야 할 코드가 길다면 들여쓰기가 한 단계 더 깊어지므로 continue문을 사용하는 편이 더 가독성이 좋다.

```
//continue 문을 사용하지 않으면 if문 내에 코드를 작성해야 한다.
for (var i = 0; i < string.length; i++) {
  // 'l'이면 카운트를 증가시킨다
  if (string[i] === search) {
    count ++;
    // code
    // code 
   	// code
  }
}

// continue 문을 사용하면 if 문 밖에 코드를 작성할 수 있다.
for (var i = 0; i < string.length; i++) {
  // 'l' 이 아니면 카운트를 증가시키지 않는다
  if(stirng[i] !== search) continue;
  
  count++;
  // code
  // code
  // code
}
```

profile
감금 당하고 개발만 하고 싶어요

0개의 댓글