반응형
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
Tags
- 자바
- IntelliJ
- vscode
- 이클립스
- table
- 이탈리아
- Java
- 자바스크립트
- windows
- 테이블
- 인텔리제이
- javascript
- json
- html
- ArrayList
- Maven
- list
- Array
- date
- 문자열
- 정규식
- CSS
- Eclipse
- Visual Studio Code
- 배열
- js
- CMD
- input
- Button
- string
Archives
- Today
- Total
어제 오늘 내일
[Javascript] switch 조건문 사용법 및 활용 예제 본문
switch 조건문 사용법 및 활용 예제
JavaScript에서 switch문은 주어진 표현식의 값에 따라 여러 경우(case) 중 하나를 선택하여 실행할 때 사용합니다.
if-else 문보다 가독성이 좋고, 여러 조건을 처리할 때 유용합니다.
기본 문법
switch (표현식) {
case 값1:
// 값1일 때 실행할 코드
break;
case 값2:
// 값2일 때 실행할 코드
break;
default:
// 모든 case가 해당하지 않을 때 실행할 코드
}
- 표현식의 결과와 case에 나열된 값들을 일치시켜 해당 블록을 실행합니다.
- break는 해당 블록을 실행한 후 switch문을 빠져나가도록 합니다.
- default는 모든 case가 일치하지 않을 때 실행됩니다. (else와 비슷한 역할)
예제 1: 간단한 switch문
let fruit = '사과';
switch (fruit) {
case '사과':
console.log('사과는 빨간색입니다.');
break;
case '바나나':
console.log('바나나는 노란색입니다.');
break;
case '포도':
console.log('포도는 보라색입니다.');
break;
default:
console.log('해당 과일 정보가 없습니다.');
}
결과
사과는 빨간색입니다.
- fruit 값이 '사과'이므로 첫 번째 case가 실행되고, break가 있어서 switch문을 빠져나갑니다.
예제 2: default 사용
let day = 3;
switch (day) {
case 1:
console.log('월요일');
break;
case 2:
console.log('화요일');
break;
case 3:
console.log('수요일');
break;
case 4:
console.log('목요일');
break;
case 5:
console.log('금요일');
break;
default:
console.log('주말입니다.');
}
결과
수요일
- day가 3이므로 case 3이 실행되고, break가 있어서 끝납니다.
- default는 case에 해당하지 않는 값일 때 실행됩니다.
예제 3: break가 없는 경우 (Fall-through)
break를 생략하면 다음 case도 계속 실행됩니다. 이를 Fall-through라고 합니다.
let score = 'B';
switch (score) {
case 'A':
console.log('훌륭합니다.');
case 'B':
console.log('잘했어요.');
case 'C':
console.log('괜찮습니다.');
default:
console.log('다음에 더 잘하세요.');
}
결과
잘했어요.
괜찮습니다.
다음에 더 잘하세요
- score가 'B'이므로 case 'B'부터 실행됩니다.
- break가 없어서 case 'C'와 default까지 연속으로 실행됩니다.
예제 4: 여러 case를 묶어서 사용
여러 값에 대해 동일한 코드를 실행하고 싶을 때 case를 묶을 수 있습니다.
let color = '빨강';
switch (color) {
case '빨강':
case '주황':
case '노랑':
console.log('따뜻한 색상입니다.');
break;
case '초록':
case '파랑':
case '보라':
console.log('차가운 색상입니다.');
break;
default:
console.log('알 수 없는 색상입니다.');
}
결과
따뜻한 색상입니다.
- color가 '빨강'이므로 case '빨강'에 해당합니다.
- case '빨강' 이후 break를 만나기 전까지 모든 코드가 실행되므로 '따뜻한 색상입니다.'가 출력됩니다.
예제 5: 표현식 사용하기
switch문은 정수뿐만 아니라 문자열, 표현식, boolean 등 여러 타입을 사용할 수 있습니다.
let age = 25;
switch (true) {
case age < 10:
console.log('어린이입니다.');
break;
case age < 20:
console.log('청소년입니다.');
break;
case age < 30:
console.log('청년입니다.');
break;
default:
console.log('성인입니다.');
}
결과
청년입니다.
- switch (true)에서 true와 각 case의 조건을 비교합니다.
- age < 30이 true이므로 '청년입니다.'가 출력됩니다.
예제 6: 타입이 다른 경우
switch문은 '엄격한 일치(===)'를 사용합니다.
타입이 다른 경우('1' vs 1) 일치하지 않으므로 주의해야 합니다.
let value = '1';
switch (value) {
case 1:
console.log('숫자 1입니다.');
break;
case '1':
console.log('문자열 1입니다.');
break;
}
결과
문자열 1입니다.
- 타입까지 일치해야 하므로, '1'과 1은 다른 값으로 처리됩니다.
정리
- switch문은 값이 일치하는 경우를 찾을 때 사용합니다.
- break로 switch문을 빠져나가야 합니다. (break가 없으면 다음 case도 실행됨)
- default는 모든 case에 해당하지 않을 때 실행됩니다.
- 여러 case를 묶거나 표현식을 사용할 수 있습니다.
- switch문은 엄격한 일치(===)를 사용합니다.
반응형
'IT > Javascript' 카테고리의 다른 글
[Javascript] 정규식으로 문자열 공백 제거하기 (1) | 2024.04.03 |
---|---|
[Javascript] textarea 값 가져오기, 넣기, 지우기 (0) | 2024.02.04 |
[Javascript] 동적 html 요소 추가하기 (0) | 2024.02.03 |
[Javascript] 소수점 2 자리 올림, 내림, 반올림, 버림 (0) | 2024.01.15 |
[Javascript] 현재 시간 yyyymmddhhmmss 포맷으로 표현하기 (0) | 2024.01.11 |
Comments