JavaScript 비교 연산자 완벽 정리: ==와 ===의 차이부터 활용법까지

JavaScript 비교 연산자의 기본 개념을 알아봅니다.

JavaScript에서 비교 연산자(comparison operator)는 값(숫자, 문자열)이나 변수 사이의 동등 여부 또는 차이를 확인할 때 사용합니다. 비교 연산자는 피연산자(operand)를 서로 비교한 뒤, 그 결과가 참인지 거짓인지에 따라 불리언(boolean) 값을 반환합니다.

피연산자(Operand): 생소하게 들릴 수 있지만 전혀 어렵지 않습니다. 피연산자란 비교 연산자 양쪽에 위치한 값을 의미합니다. 예를 들어 2 < 4에서 2와 4가 피연산자이고, <는 '작다' 연산자입니다.

불리언(Boolean)은 true(참) 또는 false(거짓), 두 가지 값만 가질 수 있는 자료형을 말합니다.

비교 연산자 목록 및 설명

• > : 크다 (초과)
• < : 작다 (미만)
• >= : 크거나 같다 (이상)
• <= : 작거나 같다 (이하)
• != : 같지 않다
• !== : 값이 다르거나 자료형이 다르다
• == : 같다 (값만 비교)
• === : 값과 자료형이 모두 같다 (엄격한 동등 비교)

비교 연산자 사용 방법

'작다' 연산자를 사용한 간단한 비교 예시입니다:

console.log(2 < 4)
// true

엄격한 동등 비교(strict equality) 예시입니다:

console.log(2 === "2")
// false

위 코드가 false를 반환하는 이유는, 삼중 등호 === 연산자가 자료형까지 포함하여 값을 엄격하게 비교하기 때문입니다. 숫자 2와 문자열 "2"는 자료형이 서로 다르므로 false가 반환됩니다.

이번에는 같은 비교를 동등 연산자(이중 등호) ==로 실행해 보겠습니다:

console.log(2 == "2")
// true

이번에는 true가 반환됩니다. 이중 등호 연산자는 자료형이 아닌 값만 비교하기 때문입니다.

비교 연산자는 조건문에서도 매우 널리 사용됩니다:

const alcoholDrinkingAge = 21
const inputAge = 17

if (inputAge < alcoholDrinkingAge) {
  console.log("죄송하지만 술을 마시기에는 나이가 어립니다")
}

비교 연산자는 프로그래밍에서 가장 단순하면서도 가장 중요한 주제 중 하나입니다. 실무에서 끊임없이 사용되기 때문입니다.

JavaScript에서 특히 주의해야 할 점은 동등 연산자(==)와 일치 연산자(===)를 혼동하지 않는 것입니다. 두 연산자를 잘못 사용하면 예상치 못한 버그로 이어져 골치 아픈 상황이 발생할 수 있습니다.

경험상 좋은 습관은 엄격한 삼중 등호 연산자 ===만 사용하고 ==는 피하는 것입니다.