반응형
==와 ===의 차이
JavaScript에서 ==
와 ===
는 두 값의 동등성을 비교하는 데 사용되는 연산자입니다. 하지만 이 둘은 다른 방식으로 동작합니다.
- == (동등 연산자):
==
는 값의 동등성을 비교합니다. 하지만 엄격한(strict) 동등성이 아니라 변환된 동등성을 비교합니다. 이것은 필요에 따라 다른 데이터 타입을 변환하여 비교를 수행합니다.- 예를 들어,
0 == false
는true
를 반환합니다. 이는 JavaScript가 숫자0
을 불리언false
로 변환하여 비교하기 때문입니다.
- === (일치 연산자):
===
는 값의 엄격한(strict) 동등성을 비교합니다. 이것은 값뿐만 아니라 데이터 타입까지 고려하여 비교를 수행합니다.- 예를 들어,
0 === false
는false
를 반환합니다. 이는 JavaScript가 값과 데이터 타입이 모두 같은지 확인하기 때문입니다. ===
는 일반적으로 예기치 않은 형변환으로 인한 오류를 방지하는 데 더 유용합니다.
console.log(0 == false); // true, 0을 false로 변환하여 비교
console.log(0 === false); // false, 값과 타입이 다르므로 false
console.log(1 == "1"); // true, 문자열 "1"을 숫자 1로 변환하여 비교
console.log(1 === "1"); // false, 값은 같지만 타입이 다르므로 false
console.log(null == undefined); // true, null과 undefined는 변환 없이 동등함
console.log(null === undefined); // false, 값은 같지만 타입이 다르므로 false
console.log(true == "true"); // false, 불리언과 문자열은 일치하지 않음
console.log(true === "true"); // false, 값은 같지만 타입이 다르므로 false
===와 Object.is의 차이
JavaScript의 Object.is()
메서드는 ES6에서 제공하는 기능이며, 이 메서드는 메서드는 ===
와 비슷하게 동작하지만, 몇 가지 차이점이 있습니다.
// 예시 1: NaN의 비교
console.log(NaN === NaN); // false
console.log(Object.is(NaN, NaN)); // true
// 예시 2: 0과 -0의 비교
console.log(0 === -0); // true
console.log(Object.is(0, -0)); // false
// 예시 3: -0과 -0의 비교
console.log(-0 === -0); // true
console.log(Object.is(-0, -0)); // true
- 첫 번째 예시에서,
NaN
은 자신과 일치하지 않는 유일한 값이므로,NaN === NaN
는false
가 됩니다. 그러나Object.is(NaN, NaN)
은true
를 반환합니다. - 두 번째 예시에서,
0
과-0
은 일반적으로 동등하게 처리되지만,-0 === -0
는true
를 반환합니다. 그러나Object.is(0, -0)
은false
를 반환합니다.-0
과0
은 다른 값으로 간주됩니다. - 마지막 예시에서,
-0 === -0
는true
를 반환합니다.Object.is(-0, -0)
도true
를 반환합니다.
Object.is()
메서드를 사용하면 JavaScript에서 값의 동등성을 더 정확하게 확인할 수 있습니다.
반응형
'책정리 > 모던 리액트 Deep Dive' 카테고리의 다른 글
12장 모든 웹 개발자가 관심을 가져야 할 핵심 웹 지표 (0) | 2024.06.28 |
---|---|
10장 리액트 17과 18의 변경 사항 살펴보기 (1) | 2024.06.03 |
3장 리액트 훅 깊게 살펴보기 (0) | 2024.05.15 |
8장 좋은 리액트 코드 작성을 위한 환경 구축하기 (0) | 2024.05.15 |
모던 리액트 Deep Dive 2.1 - 2.2 :: JSX와 리액트 파이버 (0) | 2024.02.27 |