[JS] 반복문

for문

 

**반복문을 사용하면 불필요한 코드를 반복적으로 사용하지 않고 간결하게 코드를 작성할 수 있다.** 

1부터 5까지의 수를 모두 더하는 코드를 for문으로 구현하면 다음과 같다.

let result = 0;

for (let num = 1; num <= 5; num++) {
  result = result + num;
}

console.log(result); // 15

 

이 코드를 살펴보면, 아래와 같은 순서로 진행된다.

1. for문 내부에 num이라는 변수를 선언하고 1이라는 초기값을 할당한다.
2. 변수 num이 5보다 작거나 같은지 확인한다.
3. 2의 결과가 true면, 코드블록 내부의 코드를 실행한다.
4. 변수 num을 1증가 시킨다.
5. 2부터 4까지 반복한다.
6. 2의 결과가 false면, 반복문이 종료된다.

 

이렇게 for문을 사용하면 코드를 몇 번 반복하여 실행할지 결정할 수 있다. 조건식만 바꾸면 되기 때문에 1부터 5까지의 합을 구하는 코드와, 1부터 100,000까지의 합을 구하는 코드는 큰 차이가 없다.

for (초기값; 조건식; 증감식) {
	// 실행할 코드
}

 

for 뒤에 오는 소괄호(())에는 각각 초기값, 조건식, 증감식이 들어간다. 코드블록에는 반복해서 실행할 코드가 들어간다. 

• 초기값: 증감식 반복횟수를 카운트하는 역할을 하는 변수다. (이때 변수는 정수를 의미하는 ‘integer’의 약자인 i를 주로 사용합니다.) 초기값은 반복문의 코드블록 내부에서만 유효하다.

  // 초기값(i)을 선언하고 1을 할당
  for (let i = 1; 조건식; 증감식) {
  	console.log(i);
  }

• 조건식: 코드블록 내부의 코드를 실행 여부를 결정한다. true일 경우에는 코드를 실행하며, false일 경우 반복문이 종료된다.

  // i가 3보다 작거나 같을 경우 코드 실행, 3보다 클 경우 반복문 종료
  for (let i = 1; i <= 3; 증감식) {
  	console.log(i);
  }

• 증감식: 코드블록 내부의 코드를 실행한 후 초기값으로 선언된 변수를 증가 또는 감소시키기 위한 표현식이다.

  // 코드가 실행될 때마다 i가 1씩 증가
  for (let i = 1; i <= 3; i++) {
  	console.log(i); // 1 2 3
  }

반복문 활용하기

 

이번에는 반복문으로 구구단을 출력해 보자.

let num = 3;
if (num >= 2 && num <= 9) {
	for (let i = 1; i <= 9; i++) {
		console.log(num * i);
	}
} else {
	console.log('2와 9사이의 수를 입력하세요.');
}

 

문자열과 반복문

 

이번에는 문자열에 반복문을 사용해 보겠다. (문자열에 대해 몇 가지 복습)

 

인덱스(index)

let str = 'codestates';
console.log(str[0]); // 'c'
console.log(str[4]); // 's'

 

let str = 'codestates';
console.log(str.indexOf('c')); // 0
console.log(str.indexOf('e')); // 3

(만약 찾는 문자가 2개 이상일 경우, 가장 앞에 있는 문자의 인덱스를 조회)

길이(length)

let str = 'codestates';
console.log(str.length); // 10

 

for문의 초기화, 조건식, 증감식은 모두 숫자 타입과 관련이 있기에 문자열의 첫 번째 문자부터 마지막 문자까지 모두 출력하는 코드를 구현하려면 다음과 같다.

let str = 'codestates';
for (let i = 0; i <= 9; i++) {
	console.log(str[i]);
}

 

이렇게 코드를 구현하려면 문자열의 길이를 알고 있어야만 한다.

문자열의 길이가 매우 길거나 또는 알 수 없는 상태일 때는 .length를 사용한다.

let str = 'codestates';
for (let i = 0; i <= str.length - 1; i++) {
	console.log(str[i]);
}

 

문자열 'codestates'의 길이는 10이다. 0부터 시작하는 인덱스와는 달리, 길이는 말 그대로 문자열에 속한 문자의 개수를 나타낸다. 따라서, 문자열의 마지막 문자의 인덱스는 문자열의 길이보다 1만큼 작다. 위의 예제처럼 i <= str.length - 1(또는 i < str.length)로 조건식을 작성하면, 문자열의 끝까지 순회하는 반복문을 구현할 수 있다. (문자열은 띄어쓰기도 포함이다.)

 

 

 

반복문의 중첩

 

반복문은 두 개 이상 중첩이 가능하다. 

(정육면체 주사위 두 개를 굴려서 나올 수 있는 모든 경우의 수를 구할때)

• 이 경우에는 외부 반복문의 초기화와 조건식 평가가 이루어진 후, 내부 반복문이 실행된다.
• 내부 반복문 또한 초기화와 조건식 평가가 이루어진 후 내부에 있는 코드가 실행되고, 증감식, 조건식 평가가 반복적으로 이루어 진다.
• 내부 반복문의 조건식 평가가 false가 되면, 내부 반복문은 종료가 되고 외부 반복문의 증감식과 조건식 평가가 이루어 진다.
• 이때 조건식 평가가 true면, 다시 내부 반복문을 순환하는 방식으로 진행되며 외부 반복문의 조건식이 false가 되면 모든 반복문이 종료가 된다.

 

2개의 반복문이 중첩된 경우 이중반복문, 3개의 반복문이 중첩된 경우 삼중반복문이라고 부르기도 한다.

for (let first = 0; first <= 3; first++) {
  for (let second = 0; second <= 3; second++) {
    for (let third = 0; third <= 3; third++) {
      console.log(
        `first는 ${first}, second는 ${second}, third는 ${third}입니다.`
      );
    }
  }
}

 

 

while문

 

초기화, 조건식, 증감식이 모두 필요한 for문과 달리 while문은 조건식만 입력한 후 조건식의 평가결과가 true인 경우 코드블록 내부의 코드를 반복하여 실행한다.

let num = 0;

while (num < 3) {
	console.log(num); // 0 1 2
	num++
}

 

위 코드를 for문으로 바꾸면 다음과 같다.

for (let num = 0; num < 3; num++) {
	console.log(num); // 0 1 2
}

 

while문을 사용할 때는 무한루프를 주의해야 한다. (반복문이 종료되는 조건식이 항상 참으로 평가되어 무한히 반복되는 현상)

 

do…while문

 

do…while문은 while 뒤에 오는 조건식이 true로 평가되는 동안 do 뒤에 오는 코드블록 내부의 코드를 반복하여 실행한다. 단, 이 경우 do의 코드블록 내부의 코드가 최소 한 번은 실행된다.

do {
	console.log('코드블록 내부의 코드는 최소 한 번은 실행됩니다.') 
	// '코드블록 내부의 코드는 최소 한 번은 실행됩니다.'
} while (false)

 

for문과 while문

 

for문과 while문의 용도는 명확하게 구분되지 않는다. 그러나 주로 사용하는 상황은 있기에 상황에 맞는 반복문을 사용하자.

 

 

for문을 사용하는 경우

• 반복 횟수가 비교적 명확할 때
• 배열, 문자열 내부를 순회할 때
• 반복문의 중첩이 필요할 때

while문을 사용하는 경우

• 반복 횟수가 명확하지 않을 때

 

Hello world 5번 출력