자바스크립트 반복문(while문/for문) – JavaScript 5

자바스크립트 반복문

프로그램을 제어하는 중요한 한가지는 반복을 하는 코드입니다. 어쩌면 반복이야 말로 컴퓨터가 인간을 초초월한 부분일지도 모르겠습니다. 자바스크립트 반복문 같은 것에 심오한 철학적 의미를 덧붙이는 것이 약간은 무리수 일지 모르겠습니다만, 프로그래밍을 배우면서도 반복의 파워에 대하여 간과하고 있는게 아닌가 생각이 듭니다.

매우 중요한 부분인데 컴퓨터 교재에는 반복의 파워에 대하여 잘 써있지 않습니다. 그 의미가 무엇인지도 모른체 그냥 이렇게 문법을 사용하면 for 루프가 된다. while 루프가 된다. 거의 모든 프로그래밍 교재에서 그런 식으로 다룹니다. 수천권의 교재를 봐도 계속 같은 내용만 나오기 때문에 인사이트를 얻기가 어렵습니다.

컴퓨터는 연산을 반복할 수 있습니다. PC만 하더라도 보통의 인간보다 수억배 빠르게 연산이 가능한데 이는 정말로 가공할 능력입니다. 사람은 연산을 하기 위해서 에너지를 많이 사용합니다. 머리쓰면 배고프다는 말이 있는데 실제로 뇌를 사용하는 칼로리가 필요합니다.

그럼 자바스크립트가 어떻게 연산을 반복하는지 알아보겠습니다.

while 문

while 문이나 for문이나 루프(loop)라고 합니다. 정해진 코드를 반복한다는 뜻입니다. 그런데 무한대로 반복하면 프로그램은 더 진행이 안되기 때문에 어떤 제한조건을 걸어놓고 반복을 합니다.

var count = 0;

while (count < 10){
    console.log(count++);
}
[실행결과]
0
1
2
3
...
9

위의 예제는 count 가 0부터 9까지 출력을 합니다. 10이 되면 ( ) 안의 조건식은 false 가 되므로 탈출합니다.

var count = 0;
var sum  = 0;

while (count < 10){
    sum += count;
    count++;
}
console.log("sum is : " + sum);
[실행값]
sum is  : 45

위의 코드는 0부터 9까지 더합니다. 합은 45입니다.

사용법 자체는 간단합니다. 이렇게 보면 if 문과 닮은 점이 있죠? if 문은 ( ) 조건식 평가를 한후 한번만 실행하고 끝납니다. 그런데 while 문은 ( ) 조건식 평가 후에 실행하고 다시 돌아와서 평가하는 방식입니다. 한번만 실행하고 여러번 반복하는 차이가 있지만 실행전에 조건식을 판단하는 점은 같습니다.

do while 문

do while 문과 while 문의 차이는 do while 문은 조건식을 평가하기 전에 반드시 한번은 실행된다는 점입니다. 또 while 이 뒤에 나오고 세미콜론으로 종료하는 부분입니다.

다른 것들은 while 문과 같습니다. do while 문을 만들어 놓은 이유는 while 문의 블록에 진입하지는 않지만 한번은 실행시켜야 하는 코드를 do 블록에 포함시켜야 할 때 사용하기 위해서 입니다.

while 문으로 해결이 되는 것을 괜히 do while 문으로 표현할 필요는 없습니다.

do{
    console.log("do it once and")
    
}while(false);
[실행값]
do it once and

for 문

for 문은 while 문과 더불어 국민 루프입니다. while 문의 경우 반복횟수가 (조건식) 이 유지될 때 까지 반복한다면 for 문은 for ( ) 이 안을 보면 반복이 언제 끝날지 알 수 있습니다.

보통 반복횟수가 정해진 경우에 for 문을 사용합니다. while 이나 for 나 내부적으로 루프를 도는 것은 비슷합니다. 크게 성능의 차이는 없습니다. 어느 경우에 for를 쓰고 while 을 써야 하느냐… 그것은 하다보면 알게 됩니다.

예를 들어 구구단 같은 것은 for 문을 씁니다. 어디서 부터 어디까지 반복되는지 알고 있으니까. 윈도우 프로그래밍에서는 무한 루프를 돌고 있습니다. 이 때 키보드나 마우스의 이벤트 처리를 위해서 while 루프를 돕니다. 윈도우를 대기상태에 두면 윈도우는 무한루프를 돌며 메시지가 들어오길 기다립니다. while은 어떤 일이 일어날 때 까지(조건이 바뀔 때까지) 일을 하다가 사용자가 닫기 버튼을 클릭하면 루프를 종료합니다.

GUI 프로그래밍을 해보면 알게 될 것들입니다.

var array = [1,3,5,7,9,11,13,15];
var sum = 0;

for (let index = 0; index < array.length; index++) {
    const element = array[index];
    sum += element;
}

console.log("for loop and sum is : "  + sum);

[실행값]
for loop and sum is : 64

break

break 는 while이나 for문에서 루프를 탈출하기 위해 사용합니다.

보통 if 문하고 함께 사용합니다.

for (let index = 0; index < 5; index++) {
    if(index == 3) break;
    console.log(index);
}
[실행값]
0
1
2

continue

루프를 돌다가 continue를 만나면 그 블록 아래를 건너 뛰고 다시 조건식으로 가버립니다. 블록을 건너뛰는 거죠. break 키워드와 함께 세밀한 흐름 제어를 위해서 사용합니다.

for (let index = 0; index < 5; index++) {
    if(index == 3) continue;
    console.log(index);
}
[실행값]
0
1
2
4

요약

자바스크립트 반복문에 대해서 알아봤습니다.

C언어 계열 언어를 배웠다면 좀 더 수월하게 적응할 수 있을 겁니다.

아직 for와 while 문법에 익숙하지 않다면 알고리즘 연습을 통해 익숙해지도록 합니다.

참고문서

루프와 반복 – JavaScript | MDN (mozilla.org)

Leave a Comment