JS switch 조건문
📖 switch 조건문
- if문은
true와false에 대에서 조건에 맞게 처리하는 메서드라면,switch문은 조건당 하나의 표현식을 배당받아else if처럼 쓰인다. - if문과 다르게 딱 떨어지는 값만(조건문에 연산자가 들어올 수 없다.)
- 가독성은 if문에 비해서 높음
문법
let 변수;
switch (변수){
case 상수1 : // 변수 = 상수1이면, 실행문 A실행
실행문 A;
break; // swith{} 코드 블록 탈출
case 상수2 : // 변수 != 상수1 이고, 변수 = 상수2 이면, 실행문 B 실행
실행문 B;
break; // swith{} 코드 블록 탈출
default: // 변수 != 상수1 이고, 변수 != 상수2 이면, 실행문 C 실행
실행문 C;
}
- switch조건문은
switch문과case문으로 구성된다. switch의 변수와case의 상수를 비교하여 일치하면 실행, 일치하지 않으면 다음case문으로 넘어간다.switch()괄호안에는 변수, 상수, 비교연산자 등 데이터가 자유롭게 올 수 있지만,case문 뒤에는 상수 값만 올 수 있다.
🖋️ break문의 역할과 이유
brake: 현재 조건문을 만족하는 경우 명령어를 실행하다가 break문을 만나면 해당 구문을 종료한다.
switch조건문은 break문을 만나기 전까지 조건값들을 비교하여 case문 혹은 default문을 실행한다.
그렇다면, 만약 break문이 없이 switch 조건문을 작성한다면 어떻게 될까?!
let a = 5;
//=============== break 사용하지 않았을 때 ===================
switch(a) {
case 5 :
document.write('a는 5입니다.');
case 10:
document.write('a는 10입니다.');
default:
document.write('a는 5도 10도 아닙니다.');
}
// 결과
// a는 5입니다.
// a는 5도 10도 아닙니다.
//=============== break 사용했을 때 ===================
switch(a) {
case 5 :
document.write('a는 5입니다.');
break;
case 10:
document.write('a는 10입니다.');
break;
default:
document.write('a는 5도 10도 아닙니다.');
}
// 결과
// a는 5입니다.
break문이 없으면 모든 값을 출력이 되는 결과를 볼수 있다.
case문은 switch문 내부의 여러 동작들 중에서 가장 먼저 동작할 시작점을 찾는 기준이라고 할 수 있다.
case별로 동작들을 구분하고 싶다면 필요한 구간에 break문을 작성해줘야 한다.
🖋️ switch문 장점
간결성, 가독성
switch 조건문은 else if 조건식으로 변환할 수 있다!
else if 보다 가독성은 높은편
else if문
let today //요일을 추출해서 대입할 변수
let day = new Date().getDay(); //현재 날짜를 받아오는 메서드
//console.log(day) = 2(화요일)
//요일은 일요일부터 계산한다. 일(0) ~ 토(6)
if(day == 0){
today = '일요일';
} else if(day == 1) {
today = '월요일';
} else if(day == 2) {
today = '화요일';
} else if(day == 3) {
today = '수요일';
} else if(day == 4) {
today = '목요일';
} else if(day == 5) {
today = '금요일';
} else if(day == 6) {
today = '토요일';
}
console.log (today);
🔍 결과
현재 요일을 받아온 변수 day에 대한 값이 콘솔에 나타난다!
switch문
let dday;
switch(day){
case 0 :
dday = '일요일';
break;
case 1 :
dday = '월요일';
break;
case 2 :
dday = '화요일';
break;
case 3 :
dday = '수요일';
break;
case 4 :
dday = '목요일';
break;
case 5 :
dday = '금요일';
break;
case 6 :
dday = '토요일';
break;
}
document.write(dday);
🔍 결과
else if문과 같이 현재 요일을 받아온 변수 day에 대한 값이 도큐멘트에 나타난다!
🖋️ switch문 단점
switch()의 괄호 사이에는 자유롭게 데이터가 올 수 있지만,case뒤에는 상수만 올 수 있다.
- case뒤에 변수, 조건식 등이 오게 되면 switch 조건문이 작동하지 않는다.
비교 대상에 변수나 조건식을 비교해야 할 경우 switch문 대신else if조건문을 사용해야 한다. - 비교 대상이 상수 값이면
switch조건문이 가능하고 그 밖에 보편적인 경우if조건문을 사용한다.
switch문
let num = prompt( "원하는 숫자를 입력하세요.", "" );
switch ( num ){
case num > 0 :
document.write ( "입력한 숫자는 양수입니다." );
break;
case num = 0 :
document.write ( "입력한 숫자는 0입니다." );
break;
case num < 0 :
document.write ( "입력한 숫자는 음수입니다." );
break;
default
document.write ( "숫자를 입력해주세요." );
}
🔍 결과
else if문
let num = prompt( "원하는 숫자를 입력하세요.", "" );=
if ( num > 0 ){
document.write ( "입력한 숫자는 양수입니다." );
}else if ( num = 0 ){
document.write ( "입력한 숫자는 0입니다." );
}else if ( num < 0){
document.write ( "입력한 숫자는 음수입니다." );
}else{
document.write ( "숫자를 입력해주세요." );
}
✏️ switch 조건문 연습
값1, 값2를 계산
조건 1. 값 1, 값2를 받아올 prompt
조건 2. 사칙연산을 대입할 prompt
조건 3. 결과를 출력한 변수
📝 연습 시도
let num1 = parseInt(prompt('값 1'));
let num2 = parseInt(prompt('값 2'));
let calc = prompt(`사칙연산자(+, - ,* /)를 넣으세요.`);
let result;
switch (calc){
case '+' :
result = num1 + num2;
break;
case '-' :
result = num1 - num2;
break;
case '*':
result = num1 * num2;
break;
case '/':
result = num1 / num2;
break;
}
document.write(`${num1} ${calc} ${num2} = ${result} 입니다.`);
사칙연산자 외에 다른 것을 입력했을 때 나오는 undefineded를 해결하기 위해서는 default값을 지정해줘야했다!
🖍️ 맞는 답
let num1 = parseInt(prompt('값 1'));
let num2 = parseInt(prompt('값 2'));
let calc = prompt('사칙연사자만 넣으세요.(+, -, *, /)');
let result;
switch(calc){
case '+' :
result = num1 + num2;
break
case '-' :
result = num1 - num2;
break
case '*' :
result = num1 * num2;
break
case '/' :
result = num1 / num2;
break
default :
result = '유효한 값을 입력해주세요.';
break
}
document.write(result)