반복문(while, for)

본 포스팅은
<ZeroCho님의 인프런 - 웹 게임 개발 자바스크립트 >
강의를 들으면서 정리한 내용임을 알려드립니다.

---

반복문

while문

먼저, while문의 형태를 보자.

처음;
while (조건) {
  실행;
  끝;
}

let 변수 = "딸기";
while ("딸기" === 변수) {
  console.log("딸기 좋아");
}

• while문의 조건이 true이기 때문에
  무한반복 된다.

• 이렇게 무한 반복이 될 경우, 컴퓨터가 먹통이 된다.

• 그렇다면, 무한 반복이 되는 이 while문을
  어떻게 프로그래밍에서 사용할 수 있을까?
  아래의 예문을 보자.

let 변수 = 0;
while (변수 < 5) {
  console.log("딸기 좋아");
  조건 = 조건 + 10;
}

앞의 예문에서와 같이 while문을 사용하는 예제이다.
변수는 변할 수 있는 값을 말하므로 이 변수 값을 바꿔서
조건인 (변수 < 5)를 false로 만들 수 있다.
변수 값을 바꾸는 방법을 여러 가지가 있는데,

조건 = 조건 + 10;

이 예제에서는 조건 = 조건 + 10;을 주어
while문이 무한반복하지 않도록 만들었다.

반복문의 실행 순서에 대해 알아보자.

let 조건 = 0; // 1
while (조건 < 5) {
  //2 5
  console.log("딸기 좋아"); // 3
  조건 = 조건 + 10; //4
}
("과일 좋아"); // 6

자바스크립트 코드의 흐름은 가장 윗 줄부터 차례대로 실행된다.
반복문을 만나면, 반복문의 조건이 false가 될 때까지 반복한 후, 빠져나온다.
그 후 아래에 있는 코드가 실행된다.
반복문의 조건을 검사하여 false가 되는지 검사를 하고,
반복문을 빠져나가는 것이다.

let 조건 = 0; // 1
while (조건 < 5) {
  //2 5 8
  console.log("딸기 좋아"); // 3 6
  조건 = 조건 + 3; //4 7
}
("과일 좋아"); // 9

변수인 조건의 값이 0부터 시작해서,
while문 안의 코드를 반복하다가
조건의 값이 6이 되어 5보다 커지므로 그 때 반복문을 빠져나와
반복문 바깥, 아래에 있는 “과일 좋아”라는 코드가 실행된다.

반복문을 조건문으로 바꿔보면, 그 실행 흐름을
쉽게 이해할 수 있다.
아래 예제를 보자.

let 조건 = 0; // 1
if (조건 < 5) {
  // 2
  console.log("딸기 좋아"); // 3
  조건 = 조건 + 3; //4 조건:3
}
if (조건 < 5) {
  //5
  console.log("딸기 좋아"); // 6
  조건 = 조건 + 3; // 7 조건: 6
}
if (조건 < 5) {
  // 8
  // 조건이 6이므로 false가 되어 반복문 빠져나옴
  //8
  console.log("딸기 좋아");
  조건 = 조건 + 3;
}
("과일 좋아"); // 9

이렇게 조건문을 쭉 나열한 것을 줄여서 while문이 된 것이다.

for문

for문의 형태를 보자.

for (처음; 조건; 끝) {
  실행;
}

for문은 while문보다 코드가 짧다.
그만큼 압축되어 들어있다는 것을 의미한다.
while문을 for문으로, for문을 while문으로 바꿀 수 있다.
while문과 for문을 비교해보자.

// while문
let 조건 = 0; // 1
while (조건 < 5) {
  //2 5 8
  console.log("딸기 좋아"); // 3 6
  조건 = 조건 + 3; // 4 7 조건:3
}
("과일 좋아"); // 9

// for문
for (let 조건 = 0; 조건 < 5; 조건 = 조건 + 3) {
  console.log("딸기 좋아");
}
("과일 좋아");