JavaScript 비교 연산자 완전 기초 — 숫자 비교, 이렇게만 쓰면 끝!

 

비교 연산자 한눈에 보기

(여기서 a, b는 number 타입이라고 가정)

비교	의미	예시	결과
a > b	a가 b보다 큼	5 > 3	true
a < b	a가 b보다 작음	5 < 3	false
a >= b	a가 b보다 크거나 같음	5 >= 5	true
a <= b	a가 b보다 작거나 같음	3 <= 5	true
a === b	값과 타입까지 같음	5 === "5"	false
a !== b	값 또는 타입이 다름	5 !== "5"	true

⚠️ 주의: ==, !=는 사용 비추천

==/!=는 타입을 강제로 맞춰 비교(강제 형 변환)하기 때문에 예측하기 어려운 결과가 나옵니다. 항상 ===/!==를 사용하세요.

    console.log(0 == '0');                        // true (타입을 맞춰버림)

    console.log(false == 0);                    // true

    console.log(null == undefined);       // true

 

 

---

비교 연산의 결과는 boolean

비교 연산자는 항상 true 또는 false(불리언)를 반환합니다.

    let a = 5;

    let b = 10;

    console.log(a > b);        // false

    console.log(a < b);        // true

    console.log(a >= b);     // false

    console.log(a <= b);     // true

 

이 boolean 값은 그대로 if문, 삼항 연산자 등에서 조건으로 사용됩니다.

 

---

⬇️ 실전 예시: 합격/불합격 판단

    const PASSING_SCORE = 60;

    const studentScore = 75;

    const isPassing = studentScore >= PASSING_SCORE;

    console.log(isPassing); // true

    if (isPassing) {

        console.log('합격입니다!');

    } else {

         console.log('불합격입니다.');

    }

 

 

 

입문자가 꼭 알아둘 함정 포인트

 

(1) 체이닝(연속 비교) 금지: 0 < x < 10 은 틀린 표현 수학처럼 0 < x < 10을 쓰면 의도와 다르게 동작합니다.

    const x = 7;

    console.log(0 < x < 10);                // true 같아 보이지만, 우연히 true

    console.log(0 < x && x < 10);      // ✅ 이렇게 써야 정확

 

왜냐하면 0 < x가 먼저 평가되어 true가 되고, 결국 true < 10 → 1 < 10 → true가 되기 때문이에요.

 

 

💡 정답 패턴:   최솟값   <   i   &&   i   <  최댓값

 

 

 

---

 

 

(2) 범위 포함/제외는 기호로 정확히

• 이상/이하 포함: x >= 0 && x <= 10
• 초과/미만만: x > 0 && x < 10

---

 

(3) NaN 과의 비교는 항상 false    NaN(Not-a-Number)은 어떤 값과도 같지 않습니다. 심지어 자기 자신과도!

 

    console.log(NaN === NaN);                  // false

    // 숫자인지 확인하려면:

    console.log(Number.isNaN(NaN));       // true

 

 

---

(4) 부동소수점(소수) 비교 주의: 0.1 + 0.2

    console.log(0.1 + 0.2 === 0.3);           // false (컴퓨터의 소수 표현 한계)

 

 

해결 패턴(허용 오차 사용):

    function nearlyEqual(a, b, epsilon = 1e-10) {

        return Math.abs(a - b) < epsilon;

    }

    console.log(nearlyEqual(0.1 + 0.2, 0.3));       // true

 

---

 

 

 

비교 연산자 × 조건문/삼항 사용되는 예시

 

 

(1) if 문과 함께 사용되는 예시

    const age = 19;

    if (age >= 20) {

        console.log('성인입니다.');

    } else {

        console.log('미성년자입니다.');

    }

 

 

(2) 삼항 연산자와 함께 (짧게 쓰기) 사용되는 예시

    const msg = age >= 20 ? '성인' : '미성년자';

    console.log(msg);

 

 

 

---

패턴 모음 (복붙 템플릿)

 

 

✅ 범위 체크

    function inRange(x, min, max) {

        return x >= min && x <= max;          // min 이상 max 이하

    }

 

 

✅ 점수 등급 분기

    function grade(score) {

        if (score >= 90) return 'A';

        if (score >= 80) return 'B';

        if (score >= 70) return 'C';

        if (score >= 60) return 'D';

        return 'F';

    }

 

 

✅ 필터링 (배열에서 조건에 맞는 값만)

    const scores = [55, 70, 85, 40, 91];

    const passed = scores.filter(s => s >= 60);            // [70, 85, 91]

 

 

---

 

미니 실습 문제 (입문자용)

 

 

• 짝수만 고르기
  배열 [1,2,3,4,5,6]에서 짝수만 골라 새로운 배열로 만드세요. (filter + 비교 연산자)
• 출입 가능 시간
  현재 시간이 9 이상 18 이하일 때 "영업 중", 아니면 "영업 종료"를 출력하세요.
• 나이 검사
  나이가 14 이상 16 이하이면 "청소년 관람가", 그 외에는 "관람 불가"를 출력하세요. (if 또는 삼항)
• 정렬하기
  [10, 2, 33, 25, 7]을 오름차순으로 정렬한 뒤 첫 번째/마지막 값을 출력하세요.
• 세 값 중 최댓값
  a, b, c 세 숫자 중 최댓값을 비교 연산자로 찾아 반환하는 함수를 작성하세요. (Math.max 사용 금지)

 

 

 

- 자주 하는 실수 체크리스트

• 0 < x < 10 ❌       →           0 < x && x < 10 ⭕️
• ==, != ❌             →            ===, !== ⭕️

 

---