반복문

반복문의 장점

• 여러번 반복해야 하는 일을 간편하게 처리하는 반복문

배열

• 여러 개의 변수를 한꺼번에 다룰 수 있는 자료형
• 객체 중 하나
• 대괄호[]로 생성/ 대괄호 사용 후 안에 쉼표로 구분해 자료를 입력

<script>
   // 변수를 선언합니다.
   var array = [273, 32, 103, 57, 52];
</script>

배열 요소

• 어떠한 종류의 자료형도 배열 요소가 될 수 있음
• 코드는 열 안에 자바스크립트의 모든 자료형이 넣어져 있음

<script>
   // 변수를 선언합니다.
   var array = [273, 'String', true, function() {}, {} [273, 103]];
   
   // 출력합니다
   alert(array);
</script>

배열 요소에 접근하는 방법

• 가장 앞에 있는 요소를 0번째라 표현

<script>
   // 변수를 선언합니다.
   var array = [273, 32, 103, 57, 52];
   
   // 출력합니다.
   alert(array[0]);
   alert(array[2]);
   alert(array[4]);
</script>

lenth 속성

<script>
   var arrayA = [0, 1, 2, 3];
   var arrayB = [0, 1, 2, 3, 4, 5, 6];
   alert("length of A : " + arrayA.length);
   alert("length of B : " + arrayA.length);
</script>

push() 메서드

<script>
   var array = [0, 1];
   
   array.push(2);
   array.push(3);
   array.push(4);
   
   alert(array);
</script>

=> 삽입하는 메서드

While 반복문

• 가장 간단한 반복문
• if 조건문 형태와 비슷

while (불 표현식) {
문장
}

• 무한루프: 무한히 반복문이 반복
• 무한루프의 비극적인 결과로 실행하지 않도록 주의

while (true) {
  alert('반복문');
 }

• while 반복문 종료

1. 숫자 증가
2. 내부적으로 변화

<script>
   // 변수를 선언합니다.
   var value = 0;
   
   // 반복문
   while (value < 5) {
       alert(value + '번째 반복');
       value++;
     }
</script>

3. 시간을 조건으로 변화

<script>
   // 변수를 선언합니다.
   var value = 0;
   var startTime = new Date().getTime();
   
   // 반복문
   while (new Date().getTime() < startTime + 1000) { value++; }
   // 1000ms -> 1s
   // 출력합니다.
   alert(value);
</script>

do while 반복문

• 조건의 참 거짓 여부와 상관없이 내부의 문장을 최소한 한 번은 실행해야 하는 경우 사용
• while 반복문과 형태가 비슷
• do while 반복문의 기본 형태

do { 
 문장
} while (불 표현식);

for 반복문

• 조건(while 반복문)보다 횟수에 비중을 둘 때 사용하는 반복문
• 초기식과 종결식이 있음

for (초기식; 조건식; 종결식) {
   문장
}

• 반복문 실행 순서

1. 초기식 실행
2. 조건식 비교/ 조건이 거짓이면 반복문 종료
3. 문장을 실행
4. 종결식 실행
5. 다시 '조건식 비교' 이후를 반복

---

• 초기문에 선언하는 변수는 간단한 한 글자로 만듦
• 단순 for 반복문 : for (var i = 0; i < length; i++)와 같은 형태

for (var i = 0; i < length; i++) {
문장
}

• 역 for 반복문 : 배열 요소를 역으로 출력
• 반복문의 특이한 사용

<script>
   // 변수를 선언합니다.
   var startTime = new Date().getTime();
   
   // 반복문
   for (var CPS = 0; new Date().getTIme() < startTime + 1000; CPS++) {}
   alert('초 당 연산 횟수: ' + CPS);
</script>

for in 반복문

• for in 반복문은 단순 for 반복문과 같은 기능

<script>
   var array = ['포도', '사과', '바나나', '망고'];
   for (var i in array) {
        alert(array[i]);
   }
</script>

코드조각(Visual Studio Express for Web)

• for 입력 후 tab키를 2번 누르면 실행

중첩 반복문

• 반복문을 여러 겹 중첩해서 사용

<script>
  // 변수를 선언합니다.
  var output = '';
  
  // 반복문
  for (var i = 0; i < 10; i++) {
            for (var j = 0; j < i; j++) {
                output += "*";
            } output += '\n';
        }
  // 출력합니다.
  alert(output);
</script>

---

break 키워드

• switch 조건문이나 반복문을 벗어날 때 사용
• 다음 반복문은 조건이 항상 참으로 무한 반복
• 무한루프는 break 키워드 사용으로 탈출

while(true) {
}

continue 키워드

• 현재 반복을 멈추고 다음 반복을 진행
• continue 키워드 예제

<script>
   // 반복문
   
   for (var i = 0; i < 5; i++) {
     // 현재 반복을 중지하고 다음 반복을 수행합니다.
     continue;
     alert(i) // (ㅠㅜ)
     }
</script>

• continue 키워드 예제
• 0부터 10까지의 짝수 합을 구하는 예제
• 조건문을 사용해서 홀수일 때는 continue 키워드를 만나 바로 다음 반복으로, 짝수의 합만 구해짐
• continue 키워드나 break 키워드의 적당한 사용이 바람직

<script>
    // 변수를 선언합니다.
    var output = 0;
    
    // 반복문
    for (var i = 1; i <=10; i++) {
      // 조건문
      if (i % 2 == 1) {
      // 홀수이면 현재 반복을 중지하고 다음 반복을 수행합니다.
          continue
      }
      output += i;
  }
  // 출력합니다
  alert(output);
</script>

for of 반복문

• for in 반복문은 요소가 아니라 인덱스

<script>
    var array = [1, 2, 3, 4];
    
    for (var i in array) {
         alert(i + "번째 요소는 :" + array[i] + "입니다.");
         }
</script>

-for of 반복문은 요소

<script>
    for (const element of [1,2,3,4]) {
         alert('요소는 $(element)입니다.');
</script>