== 와 === 차이점

미어캣의 개발일지·2023년 10월 14일
0

📚 ==연산자와 ===연산자

JavaScript에서 값을 비교하기 위해 ==연산자와 ===연산자를 사용한다.

두 연산자는 값이 일치하면 true를 반환, 값이 일치하지 않으면 false를 반환

두 연산자의 차이점은 무엇일까




📕 == 연산자

== 연산자는 두 피연산자의 값의 타입이 다를 경우 자동으로 일부 피연산자의 타입을 변환 후 값을 비교

10 == 10; // true
10 == "10"; // true
true == 1; // true
true == "1"; // true
10 == 10; // true

null == undefined; // true

숫자와 문자열을 비교할 때, 문자열을 숫자로 변환한다. JavaScript는 문자열의 숫자 리터럴을 Number형의 숫자로 변환하려고 한다. 처음에 그 문자열의 숫자 리터럴부터 수학적인 값을 이끌어 낸다. 그 다음 가장 가까운 Number형의 수로 반올림한다.

즉, == 는 문자열을 숫자와 비교하는 경우 문자열을 숫자로 변환하여 비교한다.




📕 === 연산자

=== 연산자는 타입을 변환하지 않으므로 == 연산자에 비해 비교하는 방식이 엄격

즉, === 연산자는 타입이 다르면, false를 반환.

10 === 10; // true
10 === "10"; // false
true === 1; // false
true === "true"; // false

null === undefined; // false
NaN === NaN; // false
  • NaN 값은 자기 자신을 포함하여 어떠한 값과도 일치하지 않음. 즉, === 연산자에 NaN 값이 존재하는 경우 항상 false.

var a = [1, 2, 3];
var b = [1, 2, 3];
console.log(a == b); // false
console.log(a === b); // false

배열을 할당할때, 각 변수는 각 메모리의 주소를 참조.

두 변수 a, b의 값과 데이터 타입이 같지만, 참조하는 메모리의 주소다르기 때문에 두 a, b는 같지 않다.

var a = [1, 2, 3];
var b = [1, 2, 3];
var c = b;
console.log(b === c); // true
console.log(b == c); // ture

새로운 변수 c에 변수 b를 할당해주면, 변수 c도 b가 참조하는 같은 메모리의 주소를 참조하게 되어,
두 변수 c, b는 같다. 이때, c, b의 값과 데이터 타입이 같기 때문에, ==와 ===의 결과값이 동일.




📕 출처

https://velog.io/@filoscoder/-%EC%99%80-%EC%9D%98-%EC%B0%A8%EC%9D%B4-oak1091tes
https://engineer-mole.tistory.com/126
https://steemit.com/kr-dev/@cheonmr/js-operator

profile
이게 왜 안되지? 이게 왜 되지?

0개의 댓글