자바스크립트(Javascript) 라벨기능을 사용하여 반복문의 흐름 제어하기

자바스크립트(Javascript) 라벨기능을 사용하여 반복문의 흐름 제어하기

 

개발환경 : window 7 64bit

 

이전아티클에서 break, continue 를 이용해 반복문에 흐름을 바꿀수가 있었습니다. 이번에 소개할 것은 한단계 업그레이드된 기능이라고 할수 있는데 라벨명의 위치를 지정해 놓고 소스에서 라벨명을 쓰게 되면 실행 커서가 그 위치로 가게 되는 것입니다. 자기가 원하는 위치에 가져 갈수 있는 것입니다.

 

 

이 기능은 자바스크립트 1.2 이상에서 실행이 가능하며

Continue, break 보다 좀더 정밀합니다.

Break 와 라벨명을 같이 쓰게 되면 반복문을 종료하고

라벨로 점프 하라는 말이 됩니다. 아래 예제가 그렇습니다.

아래 예제는 2가지 라벨을 사용했는데

Outerloop 와 innerloop 입니다. 각각 for 문의 바깥에

있죠. Break innerloop, break outerloop 가 실행되는

순간에 커서가 그쪽으로 가게 되는 것입니다.

 

<script type="text/javascript"> <!-- document.write("Entering the loop!<br /> "); outerloop:   // This is the label name for (var i = 0; i < 5; i++) {   document.write("Outerloop: " + i + "<br />");   innerloop:   for (var j = 0; j < 5; j++)   {      if (j >  3 ) break ;         // Quit the innermost loop      if (i == 2) break innerloop; // Do the same thing      if (i == 4) break outerloop; // Quit the outer loop      document.write("Innerloop: " + j + "  <br />");    } } document.write("Exiting the loop!<br /> "); //--> </script>

 

샘플이 조금 복잡해 보일수 있겠지만 잘 들여다 보면

아주 간단합니다. 결과값은 아래와 같습니다.

 

Entering the loop! Outerloop: 0 Innerloop: 0 Innerloop: 1 Innerloop: 2 Innerloop: 3 Outerloop: 1 Innerloop: 0 Innerloop: 1 Innerloop: 2 Innerloop: 3 Outerloop: 2 Outerloop: 3 Innerloop: 0 Innerloop: 1 Innerloop: 2 Innerloop: 3 Outerloop: 4 Exiting the loop!

 

이해를 돕기 위해 두번째 샘플을 준비 하였습니다.

이것은 continue 와 함께 사용한 예제 입니다.

 

<script type="text/javascript"> <!-- document.write("Entering the loop!<br /> "); outerloop:   // This is the label name for (var i = 0; i < 3; i++) {    document.write("Outerloop: " + i + "<br />");    for (var j = 0; j < 5; j++)    {       if (j == 3){          continue outerloop;       }       document.write("Innerloop: " + j + "<br />");    } } document.write("Exiting the loop!<br /> "); //--> </script>

 

Continue 와 함께 사용한 라벨의 결과 값입니다.

 

Entering the loop! Outerloop: 0 Innerloop: 0 Innerloop: 1 Innerloop: 2 Outerloop: 1 Innerloop: 0 Innerloop: 1 Innerloop: 2 Outerloop: 2 Innerloop: 0 Innerloop: 1 Innerloop: 2 Exiting the loop!