/JavaScript/반복문

반복문(Loop)

프로그램을 만들다 보면 상황에 따라

특정 코드가 여러 번 반복해야 될 때가 있을 것이다.

그 상황에서 특정 코드를 복사-붙여 넣기를 통해 해결할 수도 있겠지만

너무 많아질 경우 한계가 있을 것이다. 

 

그러한 문제를 해결해줄 수 있는 것이 반복문이다.

예제를 먼저 보자.

<script>
document.write('<li>1</li>');
document.write('<li>2</li>');
document.write('<li>3</li>');
document.write('<li>4</li>');
</script>

이렇게 순서대로 실행되는 프로그램의 코드가 있다고 하자 

저 코드에서 2번째와 3번째 코드가 반복해서 실행되어야 한다는 가정하 코드를 작성해보자

<script>
document.write('<li>1</li>');
while(true){
  document.write('<li>2</li>');
  document.write('<li>3</li>');
}
document.write('<li>4</li>');
</script>

다음과 같이 해당 반복되어야 할 코드에 while이라는 코드가 보일 것이다.

반복문의 기본형식이다. while의 () 안에는 boolean데이터 타입을 사용한다.

(if문과 같다)

 

실행되는 과정은 다음과 같다.

while문의 데이터 값을 확인해 true일 경우,

while문 안쪽의 코드를 실행해 나가다가 마지막 '}'를 만나면서 다시 while문의  boolean값을 확인한다.

그때 false값을 받게 되면 while문의 빠져나와 나머지 코드를 실행한다.

 

즉 반복문은 순서대로 실행되는 코드의 흐름을 제어하는 제어문이라 할 수 있다.

 

위의 예제는 true값을 받으면서 무한 반복되며 실행이 될 것이다. 

그러하므로 언제 종료해야 될지 지정해주어야 한다.

<script>
document.write('<li>1</li>');
var i = 0;
while(i<5){
  document.write('<li>2</li>');
  document.write('<li>3</li>');
  
  i= i + 1;
}
document.write('<li>4</li>');
</script>

 

 

다음 해당 코드를 5번 실행하도록 해보자

먼저 변수 i를 만들어 값 0을 넣어주도록 한다.(반복문에서는 주로 i를 변수로 지정한다.)

다음 반복되는 코드가 끝나는 부분에 i의 값을 1식 증가시키는 식을 넣어준다.

저 식은 기존 i의 값에 1을 더한 결과를 다시 i에 넣어준다는 뜻이다.

 

이제 중요한 괄호 안에 값인데 조건이 필요하다. 변수 i를 이용하여 i <n라는 비교 연산을 통해 boolean 값을 만들어준다.

(n에 몇 번 반복되길 원하는 숫자를 넣도록 하자)

이렇게 하면 반복문의 형식은 완성이 된다. 실행해보면 2번째 3번째 코드는 총 5번 실행될 것이다.

 

즉 저 코드에서는 변수 i의 값은 0으로 시작하고 while에 i의 값은 0 <3이라는 조건을 가지며 true 값을 받고 실행된다.

다음 마지막 i의 값에 0+1을 하여 1이라는 값을 i에 다시 넣어주면서 while의 비교 연산을 통해

실행하여 반복하다 조건에 맞는 숫자가 나타나면 false값을 만나게 종료하게 된다.

 

이러한 반복문을 통해 번거로운 작업을 통해 실행하지 않아도 손쉽게 반복할 수 있게 했으며,

반복문의 실행 순서도 정확하게 이해할 수 있았다.