15. switch문

if 조건문과 switch문의 비교 및 활용

if 조건문은 다양한 조건을 처리하는 데 유용하지만, 조건이 많아질수록 가독성이 떨어지고 유지보수가 어려워질 수 있습니다. 이를 해결하기 위해 switch문을 활용할 수 있습니다. switch문은 특정 변수의 값을 여러 경우에 비교하고, 각 경우에 따라 코드를 실행할 수 있는 구조를 제공합니다.

---

문법

switch문은 case문과 선택적으로 사용할 수 있는 default문으로 구성됩니다. 각 case문은 특정 조건을 만족할 때 실행될 코드를 포함하며, break문을 사용해 실행을 종료할 수 있습니다.

switch (변수) {
	case 값1: // 변수 === 값1
		// 실행할 코드
		break;
	case 값2: // 변수 === 값2
		// 실행할 코드
		break;
	default:
		// 일치하는 값이 없을 때 실행할 코드
}

---

작동 방식

1. switch문은 case문을 위에서부터 순차적으로 비교합니다.
2. 조건에 맞는 case를 찾으면 해당 블록의 코드를 실행합니다.
3. break문을 만나면 switch문의 실행이 종료됩니다.
4. break가 없으면 다음 case문까지 실행이 이어집니다.
5. 일치하는 case가 없으면, default문이 실행됩니다(있는 경우).

---

예제 1: 기본 동작

아래 예제는 변수 a의 값을 switch문으로 비교하는 코드입니다.

let a = 2 + 2;

switch (a) {
	case 3:
		console.log("3보다 작습니다.");
		break;
	case 4:
		console.log("4와 같습니다.");
		break;
	case 5:
		console.log("5보다 큽니다.");
		break;
	default:
		console.log("범위를 벗어났습니다.");
}

실행 결과

a는 4이므로 "값이 4와 같습니다."가 출력됩니다. break문이 있기 때문에 다른 case문은 실행되지 않습니다.

---

예제 2: break문이 없는 경우

break문이 없는 경우, 일치하는 case문부터 이후 모든 case문의 코드가 실행됩니다.

let a = 2 + 2;

switch (a) {
	case 3:
		console.log("값이 3보다 작습니다.");
	case 4:
		console.log("값이 4와 같습니다.");
	case 5:
		console.log("값이 5보다 큽니다.");
	default:
		console.log("값이 예상 범위를 벗어났습니다.");
}

실행 결과

a는 4이므로 다음과 같은 결과가 출력됩니다:

값이 4와 같습니다.
값이 5보다 큽니다.
값이 예상 범위를 벗어났습니다.

---

예제 3: 여러 case 문 묶기

여러 case문이 동일한 코드를 실행해야 한다면, 묶어서 작성할 수 있습니다.

let score = 90;

switch (score) {
	case 100:
	case 90:
		console.log("우수한 점수입니다!");
		break;
	case 80:
	case 70:
		console.log("좋은 점수입니다.");
		break;
	default:
		console.log("노력이 필요합니다.");
}

실행 결과

score가 90이므로 "우수한 점수입니다!"가 출력됩니다.

---

자료형의 중요성

switch문은 일치 비교(===) 를 사용합니다. 비교하려는 값의 형(type) 과 값(value) 이 모두 같아야 조건이 만족됩니다.

let num = prompt("값을 입력해주세요."); // prompt는 문자열로 반환

switch (num) {
	case '0':
	case '1':
		console.log("0이나 1을 입력했습니다.");
		break;
	case '2':
		console.log("2를 입력했습니다.");
		break;
	case 3: // 숫자 3을 조건으로 작성
		console.log("3을 입력했습니다."); // 숫자 3과 문자열이 일치하지 않음
		break;
	default:
		console.log("잘못된 값입니다..");
}

실행 결과

prompt 함수는 항상 문자열을 반환하므로, 숫자 입력이라도 문자열로 처리됩니다. 따라서 숫자 3을 입력해도 case 3은 실행되지 않습니다.

---

실무 활용: 주문 상태 처리

문제

전자상거래 웹사이트에서 주문 상태를 표시하려고 합니다. 상태에 따라 다른 메시지를 출력해야 합니다.

해결 코드

let orderStatus = "shipped";

switch (orderStatus) {
	case "pending":
		console.log("주문이 접수되었습니다.");
		break;
	case "processing":
		console.log("주문을 준비 중입니다.");
		break;
	case "shipped":
		console.log("주문이 배송 중입니다.");
		break;
	case "delivered":
		console.log("주문이 완료되었습니다.");
		break;
	default:
		console.log("알 수 없는 상태입니다.");
}

단계별 설명

1. orderStatus 값을 비교해 현재 상태를 확인합니다.
2. 각 case에서 상태에 맞는 메시지를 출력합니다.
3. 상태가 shipped이면 "주문이 배송 중입니다." 메시지가 출력됩니다.