제어문
제어문은 프로그램의 흐름을 제어할 수 있도록 도와주는 문장을 말한다.
제어문에는 조건식에 만족여부에 따라 코드를 제어하는 '조건문'과
변수의 일치에 따라 코드를 제어하는 '선택문',
특정코드를 원하는 횟수만큼 반복실행하는 '반복문'이 있다.
조건문
조건에 따라 특정 코드를 실행시킬 수 있다. 조건식의 값이 true인지 false인지에 따라 자바스크립트 코드를 제어한다.
if문(=만약에)
if문은 조건식을 만족할 경우(true)에만 코드를 실행한다.
조건식은 앞에서 배웠던 Boolean 데이터와 마찬가지로 그 어떤 데이터를 입력해도
true또는 false값을 반환한다.
if문이 조건식을 만족했을 경우 {}안에 있는 코드를 실행하고 종료한다.
만약 만족하지 못하면 {}안에 있는 코드는 실행하지 않고 그냥 종료한다.
[기본형]
if(조건식){조건식이 만족했을 경우 실행할 코드;}
→만족하지않을 경우 실행되지않는다.
✔() 조건식은 boolean자리이다. 따라서 0,'',빈데이터를 제외하고 문자 또는 숫자가 true가 나온다.
if 조건문의 예시로
if (walkAmount >= 10000) {
document.write("좋은 습관을 가지고 계시네요!", "</br>");}()조건식이 true일 경우에 문구가 나오고 false일 경우에는 문구가 나오지않는다.
*if{} 뒤에는 ; 세미콜론이 붙지 않는다.
else문 (=그렇지않으면)
if문의 조건식이 만족하지 않았을 경우 코드를 실행하는 문장.
[기본문]
if(조건식){
조건식이 만족했을 경우 실행할 코드;
}else{
조건식이 만족하지 않을 경우 실행할 코드;}
위와 같이 if조건문 뒤에 else 조건문이 붙는다.
else 조건문의 예시로 아래와 같이 작성할 수 있다.
var min = prompt("하루 통화량이 얼마나 되시나요?", "00분");
if (min >= 60) {
document.write("많이 통화하는 편이네요!", "</br>");
} else {
document.write("많이 통화하지 않는 편이네요");
}
var num = prompt("당신이 좋아하는 숫자를 입력하세요", "0");
//짝수일 경우
if (num % 2 == 0) {
//num을 2로 나눈 나머지 값이 0과 같다면(짝수)
document.write("당신이 좋아하는 숫자는 짝수네요.");
} else {
//홀수일 경우
document.write("당신이 좋아하는 숫자는 홀수네요.");
}else if()문
else if문은 두 가지 이상의 조건식과 정해놓은 조건을 만족하지 않았을 경우
실행되는 코드로 이루어져 있다.
else if문은 가장 위에 있는 조건식 1부터 조건식 n까지 차례로 검사하면서 만족하는 값이 나오면 그에 해당하는 코드를 실행하고 조건문을 종료한다.
조건식 중 만족하는 값이 하나도 없으면 else문의 코드를 실행하고 조건문을 종료한다.
[기본형]
if(조건식1){
조건식1이 만족하면 실행할 코드;
}else if(조건식2){
조건식2가 만족하면 실행할 코드;
}else if(조건식3){
조건식3가 만족하면 실행할 코드;}
.
.
.
else{
모든 조건이 만족하지 않았을 경우 실행할 코드;
}
예시로 아래와 같이 계절을 물을 때 사용할 수있다.
var mon = prompt("당신은 몇 월에 태어나셨나요?~?", "0월");
if (mon >= 3 && mon <= 5) {
//봄
document.write("당신은 꽃피는 봄에 태어나셨군요!", "<br>");
} else if (mon >= 6 && mon <= 8) {
// 여름
document.write("당신은 청량한 여름에 태어나셨군요!", "<br>");
} else if (mon >= 9 && mon <= 11) {
document.write("멋지다! 당신은 가을에 태어나셨군요!", "<br>");
//가을
} else {
document.write("고구마라떼가 맛있는 겨울에 태어나셨군요!");
}중첩 if문
조건문안에 조건문이 들어 있으면 이것을 '중첩 if문'이라고 한다.
[기본형]
if(조건식1){
if(조건식2){
조건식2가 만족하면 실행될 코드;
}else{
조건식2가 만족하지 않았을 때 실행될 코드;
} }else{
조건식1이 만족하지 않았을 때 실행될 코드;
}
조건식1이 만족할 경우에 if(조건식2)가 실행되며, 조건식2가 만족하지 않을 경우에 else의 코드가 실행된다.
조건식1이 만족하지 않을 경우에 맨 아래의 else의 코드가 실행된다.
서버에 저장된 회원 정보
var id = "user123";
var pw = "1234";
사용자에게 입력받은 회원 정보
var userId = prompt("아이디를 입력");
var userPw = prompt("패스워드 입력");
if (id === userId) {
//아이디가 일치했을 경우
if (pw === userPw) {
//비밀번호가 일치했을 경우
document.write(userId + "님 환영합니다.");
} else {
//비밀번호가 일치하지 않았을 경우
alert("비밀번호가 일치하지 않습니다.");
location.reload(); //새로고침}} else {
//아이디가 일치하지 않았을 경우
alert("아이디가 일치하지 않습니다.");
location.reload(); //새로고침}
confirm()메서드
'확인/취소창'을 말한다.
확인 버튼을 누르면 true를 반환하고, 취소를 누르면 false를 반환한다.
[기본형]
confirm("메시지");
*/
예시로 회원탈퇴창에서 사용할 수있다.
var result = confirm("정말 탈퇴하시겠습니까?");
if (result) {
document.write("회원 탈퇴가 완료되었습니다.");
} else {
document.write("회원 탈퇴가 취소되었습니다.");
}switch문
조건을 체크할 때는 if~else 문을 사용하지만, 처리할 명령이 많다면 if~else문을 여러개 사용하는 것보다 switch문이 더 편리하다.
기본형
switch(조건)
{
case 값1 :명령1
break
case 값2 :명령2
break
...
default:명령 n
}
조건과 일치하는 case문의 명령을 실행한 후에는 switch문을 완전히 빠져나온다. 왜냐하면 switch의 조건이 case "값1"과 일치하면 명령1을 실행하고 아래 break문을 만나 switch문을 빠져나오기 때문이다. 만약 조건과 일치하는 case문이 없다면 마지막에 있는 default문을 실행한다.
