==, === 차이점

Kingmo·2022년 4월 10일
0

1. ==(동등 비교 연산자)

동등 비교 연산자(==)는 두 개의 피연산자가 동일한지 확인하며,
Boolean을 반환한다.

console.log(1 == 1);
// expected output: true

console.log('hello' == 'hello');
// expected output: true

console.log('1' ==  1);
// expected output: true

console.log(0 == false);
// expected output: true

2. ===(일치 비교 연산자)

일치 비교 연산자(===)는 두 개의 피연산자가 동일한지 확인하며,
Boolean을 반환한다.

console.log(1 === 1);
// expected output: true

console.log('hello' === 'hello');
// expected output: true

console.log('1' ===  1);
// expected output: false

console.log(0 === false);
// expected output: false

3. ==, ===의 차이점

위 예제코드에서 두 연산자의 차이점이 보이는가?

동등 비교 연산자와 일치 비교 연산자는 좌항과 우항의 피연산자가 같은 값으로
평가되는지 비교해 불리언 값을 반환한다.

하지만 비교하는 엄격성의 정도가 다르다.
동등 비교 연산자는 느슨한 비교를 하지만 일치 비교는 연산자는 엄격한 비교를 한다.

따라서 아래 예제코드와 같이
문자열 1과, 정수 1을
동등 연산자로 비교했을 때와 일치 연산자로 비교했을 때
반환값이 다르게 나온다.

console.log('1' ==  1);
// expected output: true

console.log('1' ===  1);
// expected output: false

4. 동등 비교 연산자의 암묵적 타입변환

개발자의 의도와는 상관없이 자바스크립트 엔진에 의해
타입이 자동변환되는 것을 암묵적 타입변환이라고 한다.

동등 비교(==) 연산자는 좌항과 우항의 피연산자를 비교할 때
먼저 암묵적 타입 변환을 통해 타입을 일치시킨 후 같은 값인지 비교한다.

이러한 암묵적 타입변환은 다음과 같이 예측하기 어려운 결과를 만들어낸다.

// 동등 비교. 결과를 예측하기 어렵다.
'0' = ''; // -> false
0 == ''; // -> true
0 == '0'; // -> true
false == 'false'; // -> false
false == '0'; // -> true
false == null; // -> false
false == undefined; // -> false

따라서 동등 비교 연산자는 사용하지 않는 편이 좋다.
일치 비교 연산자를 애용하자!

profile
Developer

0개의 댓글