본문 바로가기
프로그래밍/Javascript

JavaScript 기초 : 제어문 5. break와 continue

by 조크리 2020. 9. 8.
반응형

 

5. break 사용

 

break를 반복문에서 사용하면

반복문에 있는 조건에 상관없이 if 조건에 맞으면 반복문을 빠져나갈 수 있다!

//break 연습 while 문일때 

let i = 1;

while (i <= 10) {
  console.log(i);
  if (i === 7) {
    break;
  }
  i++;
}

//break 연습 for문일 때

for (let i = 1; i <=10; i++) {
  console.log(i);
  if (i === 7) {
    break;
  }
}

위의 코드는 어떤 결과를 불러오는 걸까? 

for문일때랑 while문일때랑 똑같다. 

 

결과적으로 콘솔에서는

1

2

3

4

5

6

7

이 출력된다.

 

continue를 만나게 되면 

동작 부분을 한 번 건너띄는 것이다. 

 

 

5-2. continue 사용

 

continue를 만났을 때는 그 아래 코드가 시작되지 않고 다음 단계로 넘어간다.

??? 잘 이해가 가지 않는다. 

예시를 보면서 살펴보자!

 

아래 코드는

continue를 사용했을 때 똑같은 결과를 보여주는 for문과 while문이다.

//continue 연습 for문

for (let i = 1; i <=10; i++) {
  if (i % 2 === 0) {
    continue;
  }
  console.log(i);
}


//continue 연습 while문

let i = 1;
while (i <=10) {
  if (i % 2 === 0) {
    i++;
    continue;
  }
  console.log(i);
  i++;
}

for문 예시를 보자.

continue를 만났을 때 그 아래 코드가 시작되지 않고 바로 다음 단계(추가 동작 단계)로 넘어간다.

추가 동작 단계는 i++ 이 부분이다. 그래서 i값이 추가가 된다. 

 

 while문 예시를 보자.

while문은 for문과 다르게 추가 동작 부분이 없다. continue를 만나서 동작부분을 건너 뛰게 되면 바로 조건 부분으로 돌아가게 된다.

그래서 미리 if 문 내부에서 i를 증가시켜준다. if문 내부에서 i를 증가시키지 않으면 영원히 i가 2인채로 반복하는 코드가 된다. 

 

결과적으로 for문과  while문 두 개 모두 

1

3

5

7

9

가 콘솔에 출력된다. 

 

continue의 예시를 또 하나 보자!

for (let i = 1; i <= 50; i++) {
  if (i % 2 !== 0) {
    continue;
  }
  console.log(i);
  i++;
}

이 경우는 무엇이 출력되는 걸까?

 

제시된 for문이 동작하는 순서를 생각해보자.

일단 초기화 부분에서 i의 값은 1로 시작한다.

조건 부분에서 1은 50보다 작기 때문에 동작 부분이 실행된다.

i가 1일 때, if문의 조건 부분이 평가되기 때문에 바로 countinue가 실행된다. 홀수는 거르는거다.

for문에서 countinue가 실행되면 다시 조건 부분으로 바로 돌아가는 게 아니라, 추가 동작 부분으로 넘어가기 때문에

i가 증가한다.

 

그럼 다음 반복에서는 i가 2인 상태로 조건을 따지게 된다. 

i가 2인 경우에는 if문의 조건을 충족하지 않기 때문에 if문 아래에 있는 코드들이 실행된다.

그래서 콘솔에 2가 출력된다.

그런데 그다음부터는 i++에 의해서 i가 한 번 증가하고, 추가 동작 부분에서도 i가 증가하면서

for문이 반복할 때마다 계속해서 2씩 증가된다. 

 

결국 i는 계속 짝수가 되고, for문 안의 if문의 조건 부분은 계속해서 충족되지 않으면서

 

결과적으로는!

 

1 ~ 50까지 숫자 중 짝수만 콘솔에 출력되게 된다!

 

continue.... 헷갈린다.ㅠㅠ

 

 

여러 번 예제들을 통해 연습해봐야겠다.

 

 

반응형