[React/JS] 엄격한 비교&느슨한 비교

리액트 스터디를 하면서 자바스크립트에서 처음 보는 연산자가 나왔다. (어쩌면 학원 다닐 때 봤을지도 모름;;)

아무튼... 모르니까 확인해보도록 한다!

---

📍 느슨한 비교(Loose Comparison)

• 값만 비교함.
• 비교할 때 타입 변환을 자동으로 처리함.

• ==

5 == 5         // true (값이 같음)
'5' == 5       // true (자동으로 문자열 '5'가 숫자 5로 변환되어 비교됨)
true == 1      // true (true는 1로 변환되어 비교됨)
null == undefined  // true (null과 undefined는 동등하게 간주됨)

• !=

5 != 3         // true (값이 다름)
'5' != 5       // false (자동으로 문자열 '5'가 숫자 5로 변환되어 비교됨)
true != 1      // false (true는 1로 변환되어 비교됨)
null != undefined  // false (null과 undefined는 동등하게 간주됨)

• 이 외에 > (초과 비교), < (미만 비교), >= (이상 비교), <= (이하 비교)가 있다.

📍 엄격한 비교 (Strict Comparison)

• 값과 자료형을 모두 비교함.
• 값과 자료형이 모두 같을 때만 true를 반환함.
• 타입 변환을 하지 않고, 타입이 달라도 false를 반환함.

• ===
  • ===는 값과 자료형이 둘 다 같을 때 true를 반환
  • 값이 같더라도 자료형이 다르면 false를 반환

5 === 5         // true (값과 자료형이 모두 같음)
'5' === 5       // false (값은 같지만 자료형이 다름)
true === 1      // false (값은 같지만 자료형이 다름)

• !==
  • !==는 값과 자료형이 둘 중 하나라도 다르면 true를 반환
  • 값과 자료형이 모두 같으면 false를 반환

5 !== 5         // false (값과 자료형이 모두 같음)
'5' !== 5       // true (값은 같지만 자료형이 다름)
true !== 1      // true (값은 같지만 자료형이 다름)