[Do It!] 03. 제어문 [조건문, 선택문, 반복문]

제어문이란?

프로그램의 흐름을 제어할 수 있도록 도와주는 문장

• 조건문 : 조건을 만족하는지의 여부에 따라 코드를 제어할 수 있음 :: if문, else문, else if문
• 선택문 : 변수에 일치하는 경우의 값에 따라 코드를 제어할 수 있음 :: switch문
• 반복문 : 특정 코드를 여러 번 반복해서 실행할 수 있음 :: while문, for문

조건문

조건식의 값이 참(true), 거짓(false)에 따라 자바스크립트 코드를 제어함

 

1. IF문

if(조건식){
	자바스크립트 코드;
}

 

예제

적용예제1

var num = 10;
if(num < 500) {	//true 반환
	document.write("hello");
}

 

적용예제2

if(0) {	//false 반환
	document.write("hello");
}

 

조건식에 논리형 데이터가 아닌 다른 형이 오는 경우

조건식에 논리형 데이터(true, false)가 아닌 다른 형의 데이터가 입력되어도 true 또는 false로 인식됨

0, null, " "(빈 문자), undefined 가 입력되면 false 반환

그 밖의 값은 true 반환

 

 

2. else 문

else문은 조건식을 만족(true)할 경우와 만족하지 않을(false) 경우에 따라 실행되는 코드가 달라짐

if(조건식){
	자바스크립트 코드1;
} else {
	자바스크립트 코드2;
}

 

 

3. else if 문

else if문은 두 가지 이상의 조건식과 정해 놓은 조건을 만족하지 않았을 때 실행되는 코드로 이루어져 있음

if(조건식1){
	코드1;
} else if(조건식2){
	코드2;
} else if(조건식3){
	코드3;
} else if(조건식4){
	코드4;
} else if(조건식5){
	코드5;
} else {
	코드6;
}

가장 위에 잇는 조건식1부터 5까지 차례로 조건 검사를 하며 만족하는 값이 나오면 그에 해당하는 코드 실행하고 종료

조건식 중 만족하는 값이 하나도 없으면 else 문의 코드6을 실행

 

 

4. 중첩 if 문

조건문 안에 조건문이 있으면 중첩 if 문

if(조건식1){
	if(조건식2){
		자바스크립트 코드;
    }
}

바깥쪽에 잇는 조건식1을 만족해야만 안쪽에 잇는 조건식2를 검사함

안쪽 if 문의 조건식2를 만족하지 않으면 조건식1 코드만 실행하고 종료됨

 

 

선택문

switch 문

변수에 저장된 값과 switch 문에 있는 경우(case)의 값을 검사하여 일치하는 값이 있을 때 그에 해당하는 코드 실행

if문과 용도는 비슷하나 if문은 만족하는 데이터가 여러개일 경우 주로 사용

switch문은 여러 경우의 값 중 일치하는 데이터를 찾아 해당하는 코드를 실행시킬 때 사용

var 변수 = 초깃값;
switch(변수){
    case 값1:코드1;
    break;
    case 값2:코드2;
    break;
    case 값3:코드3;
    break;
    case 값4:코드4;
    break;  
    
    default; 코드5;
}

변수에 저장된 값은 case의 값을 하나씩 검사함

일치하는 데이터가 있으면 코드 실행 -> break문을 만나 switch 문 종료

일치하는 데이터가 없으면 마지막 default 코드 실행하고 switch문 종료

 

 

반복문

1. while문

조건식을 만족할 때까지 코드를 여러회 반복하여 실행

1) 조건식을 검사하고, 만족한다면

2) 코드와 증감식을 실행

3) 다시 조건식을 검사함

var 변수 = 초깃값;
while(조건식){
	자바스크립트 코드;
	증감식;
}

 

 

2. do while문

반드시 한 번은 코드를 실행하고 조건식을 검사함

var 변수 = 초깃값;

do{
	자바스크립트 코드;
	증감식;
} while (조건식)

 

 

3. for 문

for(초깃값; 조건식; 증감식){
	자바스크립트 코드;
}

 

 

4. break 문

반복문인 while문 또는 for문에서 break문을 실행하면 조건식과 상관없이 강제로 반복문을 종료

break문은 반복문을 강제로 종료할 때 사용

for(초깃값; 조건식; 증감식){
	break;	//반복문을 강제로 종료합니다.
	자바스크립트 코드;
}

var 변수 = 초깃값;
while(조건식){
	break;	//반복문을 강제로 종료합니다.
	자바스크립트 코드;
	증감식;
}

 

 

5. continue문

continue문은 반복문에서만 사용할 수 있음

while문에 사용할 경우 continue 다음의 코드는 무시하고 바로 조건식으로 이동해 조건검사

while문 안에 있는 continue => "다음에 오는 코드는 무시하고 조건식에서 조건 검사를 실행해!" 라는 뜻

 

for문에서 continue문 실행할 경우 continue문 다음에 오는 코드는 무시하고 바로 증감식으로 이동하여 증감 연산을 실행

for문 안에 있는 continue => "다음에 오는 코드는 무시하고 증감식을 바로 실행해!" 라는 뜻

for(초깃값; 조건식; 증감식){
	continue;	//뒤의 코드는 건너뛰고, 다시 반복문 증감식 수행
	자바스크립트 코드;
}

var 변수 = 초깃값;
while(조건식){
	증감식;
	continue;	//다음에 오는 코드는 무시, 조건식에서 조건 검사를 실행
	자바스크립트 코드;

}

 

 

6. 중첩 for 문

for문 안에 for문을 사용한 것을 중첩for문

for(초깃값; 조건식; 증감식){
    for(초깃값; 조건식; 증감식){
    	자바스크립트 코드;
    }
}

 

 

나온 메소드들

confirm()메소드

확인/취소 창은 confirm() 메서드를 사용함. 

[확인] => true 반환

[취소] => false 반환

confirm("message");

 

location.reload();

브라우저 새로고침

 

\

문자열 데이터는 줄을 바꾸면 오류가 발생함.

하지만 \와 함께 코드를 작성하면 문자열의 줄을 바꿔도 오류가 발생하지 않음.