JavaScript / 조건문 / if, else if, else, switch
특정 조건 만족 시 어떤 작업을 수행하고 싶을 때 사용하는 것이 조건문입니다. 크게 if문과 switch문으로 구분할 수 있습니다. 조건식에서 비교할 값이 많을 때 switch문을 사용합니다.
if, else if, else
문법
if
if ( condition1 ) { statement1 }
condition1을 만족하면 statement1을 실행합니다.
if, else
if ( condition1 ) { statement1 } else { statement2 }
condition1을 만족하면 statement1을 실행하고, 만족하지 않으면 statement2를 실행합니다.
if, else if
if ( condition1 ) { statement1 } else if ( condition2 ) { statement2 }
condition1을 만족하면 statement1을 실행하고, condition2을 만족하면 statement2을 실행합니다.
if, else if, else
if ( condition1 ) { statement1 } else if ( condition2 ) { statement2 } else { statement3 }
condition1을 만족하면 statement1을 실행하고, condition2을 만족하면 statement2을 실행하고, 둘 다 만족하지 않으면 statement3을 실행합니다.
예제
숫자를 입력하면 10보다 작은지, 10인지, 10보다 큰지 알려주는 예제입니다.
<!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>JavaScript | if</title> </head> <body> <script> var jbNum = prompt( 'Enter Number', '' ); if ( jbNum < 10 ) { document.write ( '<p>Your number is less than 10.</p>' ); } else if ( jbNum == 10 ) { document.write ( '<p>Your number is 10.</p>' ); } else { document.write ( '<p>Your number is greater than 10.</p>' ); } </script> </body> </html>
예를 들어 20을 입력하면 다음과 같이 나옵니다.
Switch
문법
switch ( condition ) { case value1: statement1; break; case value2: statement2; break; ... default: statement3; }
condition의 값이 value1이면 statement1을, value2면 statement2를, 그 어느 것도 아니라면 default가 적용되어 statement3을 실행합니다.
순차적으로 값을 비교하며, 조건이 맞을 때 break가 있다면 그 이후의 비교는 하지 않습니다. 즉, switch 구문을 바로 끝냅니다. 만약 break가 없다면 조건이 맞아도 그 다음 비교를 계속합니다.
예제
1을 입력하면 'First'를, 2를 입력하면 'Second'를, 3을 입력하면 'Third'를, 이외의 값을 입력했다면 'You did not input 1 or 2 or 3.'을 출력하는 예제입니다.
<!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>JavaScript Statement | switch</title> <script> var jb = prompt( 'Enter 1 or 2 or 3', '' ); switch ( jb ) { case '1': var jb1 = 'First'; break; case '2': var jb1 = 'Second'; break; case '3': var jb1 = 'Third'; break; default: var jb1 = 'You did not input 1 or 2 or 3.'; } </script> </head> <body> <script> document.write( '<p>' + jb1 + '</p>' ); </script> </body> </html>