Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |
Tags
- 헤드퍼스트 디자인패턴
- VueDevTools
- Vue
- 이것이자바다
- 자바스크립트
- 이벤트루프
- Git
- HTTP
- Junit5
- AWS 비용 최적화 바이블
- 한빛미디어
- pinia
- 구글 엔지니어는 이렇게 일한다
- 1436
- 스프링
- cicd
- 도메인 주도 개발 시작하기
- vue-router
- 이것이안드로이드다
- 네트워크
- 알고리즘
- GitHub
- 백준
- 러닝GO
- Java
- WebTestClient
- 혼공컴운
- JavaScript
- MySQL
- 2817
Archives
- Today
- Total
이시안 개발 블로그
== vs === vs typeof 본문
자바스크립트의 값을 비교할 때 주로 ==
, ===
, typeof
이 3가지를 사용합니다.
3가지 방법의 차이를 알아보겠습니다.
동등 연산자 ==, !=
console.log(1 == 1); // true
console.log(1 == '1'); // true
console.log(1 == true); // true
console.log(0 != '0'); // false
console.log(undefined != null); // false
동등 연산자는 두 피연산자를 비교하여 boolean 값을 반환합니다.
이 때 타입이 서로 다른 피연산자도 비교한다는 특징이 있습니다.
- 두 피연산자가 모두 객체라면 같은 객체를 참조할 때 true
- null 과 undefined 를 서로 비교할 때 true
- 타입이 다른 경우 동일한 타입으로 암시적 형변환해서 비교
- 숫자와 문자열 비교 시 문자열을 숫자로 변환
- boolean 과 비교 시 true 는 1, false 는 0으로 변환
- 객체와 숫자, 객체와 문자열 비교 시 객체를
valueOf()
,toString()
을 사용해 비교
위와 같이 느슨한 비교를 한다는 특징 때문에 동등 연산자로 비교하는 것은 보통 지양됩니다.
일치 연산자 ===, !===
console.log(1 === 1); // true
console.log(1 === '1'); // false
console.log(1 === true); // false
console.log(0 !== '0'); // false
console.log(undefined !== null); // false
동등 연산자와 같은 값들을 비교했을 때 결과가 다른 것을 확인할 수 있습니다.
일치 연산자는 암시적 형변환이 발생하지 않고 타입까지 검사합니다.
- 서로 다른 타입의 비교 시 false
- 두 피연산자가 객체인 경우 같은 객체를 참조할 때 true
- 두 피연산자가 모두 null 이거나 undefined 인 경우 true
- 피연산자 중 하나가 NaN 이라면 false
- 숫자, 문자, boolean 끼리의 비교는 서로 동일한 값인 경우에만 true
위와 같은 비교를 하기 때문에 일치 연산자로 비교를 하는 것이 거의 모든 상황에서 비교적 안전합니다.
typeof
console.log(typeof 20); // number
console.log(typeof 'hello'); // string
console.log(typeof true); // boolean
console.log(typeof {}); // object
console.log(typeof foo); // undefined
typeof 연산자는 피연산자의 타입을 반환합니다.
자바스크립트의 내장 타입만 반환하며 null 을 제외한 기본 타입과 function, object 가 있습니다.
선언되지 않은 변수에 사용할 경우 undefined 값을 반환합니다.
정리
- 동등 연산자 ==, != 는 타입이 다른 경우 암시적 형변환을 통해 값을 비교한다
- 일치 연산자 ===, !== 는 타입까지 비교한다
- typeof 연산자는 피연산자의 타입을 반환한다
'🌐Web > Javascript' 카테고리의 다른 글
스코프 (0) | 2022.04.02 |
---|---|
타입 변환 (0) | 2022.03.27 |
Call Stack & Event Loop (0) | 2022.03.06 |
자바스크립트 Value & Reference (0) | 2022.02.27 |
자바스크립트의 데이터 타입 (0) | 2022.02.24 |
Comments