프론트엔드/JAVASCRIPT

JavaScript 조건문 정리

CYANREDSKY 2025. 9. 23. 06:46

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