[Javascript 기초] 반복문(for, while, do while) + break, continue - 가온 코딩

반복문(for, while, do while) + break, continue

목차

0. 사용 이유

1. for

2. while

3. do while

4. break

5. continue

 

0. 사용 이유

1부터 10까지 로그를 찍어달라고 했을 때,

console.log(1);
console.log(2);
console.log(3);
.
.

 

위와 같이 찍으면 될 것이다.

그런데 1부터 100까지, 1부터 10,000까지 찍어달라고하면? 헉, 100개의 콘솔 로그를 찍기는 너무 힘들다.

 

이렇게 동일한 작업을 여러번 반복할 때 쓰는 것이 반복문(Loop)이다.

 

1. for

가장 많이 사용하는 반복문은 for이다.

명확한 횟수가 정해져 있는 경우 주로 사용한다.

for (let i = 0; i < 10; i++) {
	//반복할 코드
}

for문은 세미클론(;)으로 구분하며, 세 부분으로 나눌 수 있다.

 

(1) let i  = 0;

첫번째 부분: 초기 값을 설정

반복문에 진입할 때 처음 한 번만 진행된다.

i 변수를 만들고 0 값을 넣었다는 뜻

 

(2) i < 10;

두번째 부분: 조건

반복문을 돌면서 조건을 계속 확인하고, false가 되면 멈춘다.

i가 10보다 작은경우 계속 true가 반환되어 돈다.

 

(3) i++

세번째 부분: 코드 실행 후 작업

반복문이 한 번 실행된 후 해야되는 작업을 적어놓는다.

1번 돌때마다 i가 1씩 증가한다는 뜻

 

그러면 코드를 실행시켰을 때 어떻게 될까?

 

i = 0

i가 10보다 작으므로 코드 실행

i 값 1 증가

 

i = 1

i가 10보다 작으므로 코드 실행

i 값 1 증가

 

i = 2

i가 10보다 작으므로 코드 실행

i 값 1 증가

 

i = 3

i가 10보다 작으므로 코드 실행

i 값 1 증가

 

(반복)...

 

i = 9

i가 10보다 작으므로 코드 실행

i 값 1 증가

 

i = 10

i가 10보다 작지 않으므로 코드 중지(반복문 실행 X)

 

for (let i = 0; i < 10; i++) {
	console.log(i)
}

//0
//1
//2
//3
//4
//5
//6
//7
//8
//9

for (let i = 0; i < 10; i++) {
	console.log(i+1)
}

//1
//2
//3
//4
//5
//6
//7
//8
//9
//10

for (let i = 1; i <= 10; i++) {
	console.log(i)
}

//1
//2
//3
//4
//5
//6
//7
//8
//9
//10

 

 

 

2. while

명확한 횟수가 정해져 있지 않은 경우 주로 사용한다

while의 기본 생김새는 아래와 같다.

let i = 0;	// i 변수 선언
while (i<10) {	//반복 조건
	//반복할 코드
    i++;	// 코드실행 후 작업. 이게 없으면 i는 계속 0이므로 무한반복되어서 터진다.
}

let i = 0;
while(i<10){
	console.log(i);
    i++;
}

//0
//1
//2
//3
//4
//5
//6
//7
//8
//9

 

3. do.. while

while문과 비슷하지만, 조건을 아래로 옮길 수 있다. 이 차이점이 큰 게 무엇이냐면, while 처음 실행부터 조건문에 맞지 않으면 반복을 시작하지 않는다. 하지만 do.. while문은 일단 시작하고 조건을 만나기때문에, 무조건 한번은 실행한다.

let i = 0;
do {
	//코드
    i++;
}	while(i<10)

let i = 0;
do {
	console.log(i);
    i++;
} while(i<10)

//0
//1
//2
//3
//4
//5
//6
//7
//8
//9

let i = 0;
do {
    console.log(i);
    i++;
}   while(i>10);

//0
//i가 10보다 크진 않지만, 무조건 한번은 출력

 

4. break

break: 멈추고 빠져나옴

 

아래 예시를 보면, confirm으로 계속 진행할지 물어보는데 확인을 누를경우 true로 되어서 계속 반복한다.

취소를 누리면 if(!answer)의 false에 해당되기 때문에 break가 되는데, 이때 while에서 빠져나오게 된다.

 

이렇게 무한 반복문은 특정 조건이 되었을 때 빠져나오게 해주는 게 중요하다.

// break
while(true){
    let answer = confirm("계속 진행??");
    if(!answer){
        break;
    }
}

 

5. continue

continue:멈추고 다음 반복으로 진행

짝수만 콘솔로 나타내고 싶을 경우에는 아래와 같다.

// continue
// 짝수만

for(let i = 0; i < 10; i++){
    if(i%2){	// 2로 나눴을 때 나머지가 0인 경우, false가 되기 때문에 continue되지 못한다.
        continue;
    }
    console.log(i);
}

//0
//2
//4
//6
//8

 

참고자료

코딩앙마 - 자바스크립트 기초 강좌 : 100분 완성(https://youtu.be/KF6t61yuPCY)