JavaScript에서 조건문(Conditional Statement) 은 특정 조건이 참인지 거짓인지에 따라 코드 실행 흐름을 제어합니다. 웹 개발에서 분기 처리, 검증, 이벤트 제어 등에 필수적으로 사용됩니다.
1. if문
가장 기본적인 조건문으로, 조건이 true일 때만 실행됩니다.
let age = 20;
if (age >= 18) {
console.log("성인입니다.");
}
2. if ... else문
조건이 거짓일 때 다른 코드를 실행할 수 있습니다.
let age = 15;
if (age >= 18) {
console.log("성인입니다.");
} else {
console.log("미성년자입니다.");
}
3. if ... else if ... else문
여러 조건을 순차적으로 검사할 때 사용합니다.
let score = 85;
if (score >= 90) {
console.log("A 학점");
} else if (score >= 80) {
console.log("B 학점");
} else if (score >= 70) {
console.log("C 학점");
} else {
console.log("F 학점");
}
4. 중첩 if문
조건문 안에 또 다른 조건문을 넣어 세부적인 조건을 검사할 수 있습니다.
let isMember = true;
let age = 20;
if (isMember) {
if (age >= 18) {
console.log("성인 회원입니다.");
} else {
console.log("청소년 회원입니다.");
}
} else {
console.log("비회원입니다.");
}
5. 삼항 연산자(Conditional Operator)
조건문을 간단히 표현할 때 사용합니다.
let age = 18;
let result = (age >= 18) ? "성인" : "미성년자";
console.log(result); // 성인
6. switch문
값에 따라 여러 경우(case)를 처리할 때 사용합니다.
- break를 쓰지 않으면 다음 case로 넘어가는 fall-through 발생
- default는 조건에 맞는 case가 없을 때 실행
let day = 3;
switch (day) {
case 1:
console.log("월요일");
break;
case 2:
console.log("화요일");
break;
case 3:
console.log("수요일");
break;
default:
console.log("기타 요일");
}
7. 논리 연산자를 활용한 조건
&&, || 같은 논리 연산자를 사용해 조건을 간결하게 작성할 수 있습니다.
let isLogin = true;
let isAdmin = false;
if (isLogin && isAdmin) {
console.log("관리자 페이지 접근 허용");
} else {
console.log("접근 불가");
}
8. Truthy / Falsy 값
JavaScript에서는 조건문에서 불리언이 아닌 값도 평가됩니다.
- Falsy 값: false, 0, "", null, undefined, NaN
- 이 외의 값은 모두 Truthy 로 처리
if ("Hello") {
console.log("실행됨"); // 문자열은 truthy
}
if (0) {
console.log("실행 안 됨"); // 0은 falsy
}
9. Optional Chaining과 Nullish Coalescing
Optional Chaining (?.)
객체나 속성이 없는 경우에도 오류 없이 안전하게 접근
let user = null;
console.log(user?.name); // undefined (오류 발생 X)
Nullish Coalescing (??)
null 또는 undefined인 경우에만 기본값을 적용
let username = null;
let displayName = username ?? "Guest";
console.log(displayName); // Guest
마무리
JavaScript 조건문은 크게 다음과 같이 구분할 수 있습니다.
- 기본 분기: if, if...else, if...else if
- 간결 표현: 삼항 연산자
- 여러 경우 처리: switch
- 논리적 제어: 논리 연산자, Truthy/Falsy, 최신 문법(?., ??)
조건문을 자유자재로 다루면, 프로그램의 흐름을 효율적으로 제어할 수 있고, 가독성 높은 코드를 작성할 수 있습니다.
'프론트엔드 > JAVASCRIPT' 카테고리의 다른 글
| JavaScript 반복문 정리 (0) | 2025.09.23 |
|---|---|
| JavaScript 배열(Array) 정리 (0) | 2025.09.23 |
| JavaScript 불리언(Boolean) (0) | 2025.09.23 |
| JavaScript i++ 와 ++i 의 차이 (0) | 2025.09.23 |
| JavaScript란 무엇인가? (0) | 2025.09.22 |