JavaScript에서 값을 비교할 때 ==(이중 등호)와 ===(삼중 등호) 중 어떤 것을 사용해야 할지 고민해 본 적이 있으신가요? 두 연산자는 비슷해 보이지만 동작 방식에 중요한 차이가 있습니다. 이 글에서는 각 연산자의 특징과 차이점을 예제와 함께 살펴보겠습니다.
이중 등호(==): 추상적 동등 비교
==는 추상적 동등 비교 연산자입니다. 비교를 수행하기 전에 피연산자들을 같은 타입으로 자동 변환하는데, 이를 '타입 강제 변환(type coercion)'이라고 부릅니다. 그래서 타입이 달라도 값만 같으면 true를 반환합니다.
4 == 4 // true '4' == 4 // true 4 == '4' // true 0 == false // true
위 예제에서 문자열 '4'와 숫자 4를 비교하면 JavaScript가 자동으로 타입을 맞춰주기 때문에 true가 반환됩니다. 마찬가지로 숫자 0과 불리언 false도 같은 값으로 취급됩니다.
삼중 등호(===): 엄격한 동등 비교
===는 엄격한 동등 비교 연산자입니다. 타입 변환 없이 값과 타입을 모두 비교하며, 타입이 다르거나 내용이 다르면 무조건 false를 반환합니다.
4 === 4 // true
4 === '4' // false
var v1 = {'value': 'key'};
var v2 = {'value': 'key'};
v1 === v2 // false
숫자 4와 문자열 '4'는 내용은 같아 보여도 타입이 다르기 때문에 false가 반환됩니다. 또한 객체를 비교할 때 주의해야 합니다. 위 예제의 v1과 v2는 내용이 완전히 동일하지만, 객체는 값이 아닌 참조(reference)로 비교되기 때문에 서로 다른 메모리 위치를 가리키므로 false가 됩니다.
어떤 연산자를 사용해야 할까?
일반적으로는 ===를 사용하는 것이 권장됩니다. 타입 강제 변환이 일어나지 않아 예측 가능한 결과를 얻을 수 있고, 의도치 않은 버그를 방지할 수 있기 때문입니다. 실제로 Airbnb, Google 등 주요 코딩 컨벤션 가이드에서도 === 사용을 표준으로 권장하고 있습니다.
다만 null이나 undefined를 함께 검사할 때처럼 의도적으로 느슨한 비교가 필요한 경우에는 ==를 사용할 수 있습니다. 예를 들어 x == null은 x === null || x === undefined와 같은 결과를 간결하게 표현합니다.
핵심 요약
==: 비교 전 타입을 자동으로 변환하는 추상적 동등 비교===: 타입까지 정확히 비교하는 엄격한 동등 비교- 객체는 참조로 비교되므로 내용이 같아도 다른 객체면
false - 특별한 이유가 없다면 항상
===사용을 권장