[JavaScript] 반복문

우리가 다룰 반복문은 총 6가지이다. 

1. for in 반복문
2. for of 반복문
3. for 반복문
4. while 반복문
5. break
6. continue

하나씩 살펴보자.

 

for in 반복문

for in 반복문은 배열 요소를 하나하나 꺼내서 특정 문장을 실행할 때 사용한다. 기본 형태는 다음과 같다.

      for (const 반복 변수 in 배열 또는 객체) {
        문장
      }

직접 예시를 보는 것이 이해가 빠르다.

    <script>
      const todos = ["우유 구매", "업무 메일 확인하기", "필라테스 수업"];
      for (const i in todos) {
        console.log(`${i}번째 할 일: ${todos[i]}`);
      }
    </script>

보다시피 for 반복문의 반복 변수(위의 코드에서는 i)에는 요소의 인덱스들이 들어옴을 확인할 수 있다. 이를 활용해서

배열 요소에 접근할 수 있다.

 

 

 

for of  반복문

for in 반복문은 반복 변수에 인덱스가 들어간다. 그래서 반복문 내부에 요소를 사용하려면 fruits[i]와 같은 형태로 사용하며, 사실은 안정성을 위해 몇 가지 코드를 더 추가해야 한다. 

그러나 for of 반복문은 요소의 값을 반복할 때 안정적으로 사용할 수 있다. 기본 형태는 다음과 같다.

      for (const 반복 변수 of 배열 또는 객체) {
        문장
      }

예시를 확인해보자.

    <script>
        const todos = ['우유 구매', '업무 메일 확인하기', '필라테스 수업']
        for (const todo of todos) {
            console.log(`오늘의 할 일: ${todo}`)
        }
    </script>

 

 

 

for 반복문

for 반복문은 특정 횟수만큼 반복하고 싶을 때 사용하는 범용적인 반복문이다. 기본 형태는 다음과 같다.

      for(let i = 0; i < 반복 횟수; i++) {
        문장
      }

 

예시를 확인해보자.

    <script>
      for (let i = 0; i < 5; i++) {
        console.log(`${i}번째 반복입니다.`);
      }
    </script>

 

for 반복문을 이용해 1부터 100까지 더하는 프로그램을 만들어보자.

    <script>
      for (let i = 1; i <=100 ; i++) {
        output += i
      }
      console.log(`1~100까지 숫자를 모두 더하면 ${output}입니다.`)
    </script>

 

for 반복문은 배열과 함께 조합할 수 있다. 다음의 코드를 보자.

    <script>
      const todos = ["우유 구매", "업무 메일 확인하기", "필라테스 수업"];

      for (let i = todos.length - 1; i >= 0; i--) {
        console.log(`${i}번째 할 일: ${todos[i]}`);
      }
    </script>

 

 

 

 while 반복문

while 반복문은 if 조건문과 형태가 매우 비슷한 반복문이다. if 조건문과 다른 점은 문장을 한 번만 실행하고 끝나는 것이 아니라 불 표현식이 true면 계속해서 문장을 실행한다는 것이다. 기본형태는 다음과 같다.

      while (불 표현식) {
        문장
      }