반응형
동등 연산자 vs 일치 연산자 vs typeof
자바스크립트에는 시각적으로 비슷하지만 동작 방식이 매우 다른 두 가지 동등성 검사 연산자가 있습니다. ==
와 ===
입니다.
=== (엄격한 동등성)
===
연산자는 엄격한 동등성(strict equality) 을 검사합니다.
비교하는 두 값의 타입과 값이 모두 같아야 true
를 반환합니다.
예시:
5 === 5; // true (둘 다 숫자이고 값이 같다)
"hello world" === "hello world"; // true (둘 다 문자열이고 값이 같다)
true === true; // true (둘 다 불리언이고 값이 같다)
반면, 타입이나 값이 다르면 false
가 됩니다.
77 === "77"; // false (숫자와 문자열은 타입이 다름)
"cat" === "dog"; // false (같은 타입이지만 값이 다름)
false === 0; // false (타입과 값 모두 다름)
== (느슨한 동등성)
==
연산자는 느슨한 동등성(loose equality) 을 검사합니다.
비교 시 타입 강제 변환(type coercion) 을 수행하여, 서로 다른 타입을 같은 타입으로 변환한 후 값을 비교합니다.
예를 들어:
77 == "77"; // true
위 경우, 문자열 "77"
을 숫자 77
로 변환한 후 비교하기 때문에 true
가 됩니다.
반면 ===
는 타입이 다르면 무조건 false
를 반환합니다.
77 === "77"; // false
또 다른 예:
false == 0; // true
이는 자바스크립트에서 false
와 0
이 모두 falsy
값이기 때문입니다.
Falsy 값
자바스크립트에서 falsy
값은 조건문에서 false
처럼 평가되는 값들을 뜻합니다. false == 0
이 true
가 되는 이유도 여기에 있습니다.
대표적인 falsy
값은 다음과 같습니다:
false
0
""
null
undefined
NaN
Falsy 값 비교
1. false, 0, ""
==
연산자로 비교할 때, false
, 0
, ""
는 모두 서로 같다고 평가될 수 있습니다.
false == 0; // true
0 == ""; // true
"" == false; // true
이는 모두 false
로 강제 형변환 되기 때문입니다.
2. null, undefined
null
과 undefined
는 특수한 관계를 가지고 있습니다.
null
과undefined
끼리는==
연산 시true
를 반환합니다.- 하지만 이 둘은 다른 어떤 값과는
==
연산 시false
가 됩니다.
null == null; // true
undefined == undefined; // true
null == undefined; // true
null == 0; // false
undefined == false; // false
3. NaN
NaN
은 특별히, 자기 자신과도 같지 않은 유일한 값입니다.
NaN == NaN; // false
NaN == null; // false
NaN == undefined; // false
typeof 연산자
typeof
연산자는 피연산자의 타입을 문자열로 반환합니다.
typeof 123; // "number"
typeof "hello"; // "string"
typeof true; // "boolean"
typeof undefined; // "undefined"
typeof null; // "object" (역사적인 이유로 null은 object로 반환됨)
typeof {}; // "object"
typeof []; // "object" (배열도 객체로 간주)
typeof function () {}; // "function"
typeof
는 주로 변수나 값의 타입을 확인할 때 사용합니다.- 단,
null
에 대해서는 typeof null이"object"
를 반환하는 특이점이 있으니 주의해야 합니다. - 함수는 특별히
"function"
타입으로 반환되어 다른 객체와 구분됩니다.
반응형
'개발 > 자바스크립트' 카테고리의 다른 글
자바스크립트 개발자라면 알아야 할 33가지 개념 - 6. 함수 스코프, 블록 스코프 및 렉시컬 스코프 (1) | 2025.06.16 |
---|---|
자바스크립트 개발자라면 알아야 할 33가지 개념 (4) | 2025.06.13 |
자바스크립트 개발자라면 알아야 할 33가지 개념 - 4. 암묵적, 명시적, Nominal, 구조적 및 덕 타이핑 (0) | 2025.06.10 |
자바스크립트 값 타입 vs 참조 타입: 스택과 힙 메모리로 완벽 이해 (1) | 2025.06.09 |
자바스크립트 원시 타입 완전 정리 - 7가지 Primitive Types 한눈에 보기 (0) | 2025.06.09 |