-JavaScript- 비교연산자 '=='과 '==='의 차이

프로그래밍 언어를 c/c++로 처음 접한 나로서는 '===' 연산자는 굉장히 생소했다.

기본적으로 ==과 ===의 기능은 동일해 보인다. 

다음 코드를 참고해보자.

//동일한 type간의 비교연산
1 == 1
true
1 === 1
true

'hello' == 'hello'
true
'hello' === 'hello'
true

'hello' == 'goodbye'
false
'hello' === 'goodbye'
false

여기까지는 ==과 ===의 차이는 드러나지 않는다.

하지만 다음 코드에서 다른 점을 알 수 있다.

//다른 type간의 비교연산
1 == '1'
true

1 === '1'
false

왼쪽 항은 숫자 오른쪽 항은 문자열을 넣고 비교연산을 수행해보았다.

'=='연산자는 true를 반환하고 '==='연산자는 false를 반환한다.

그렇다면 이 차이는 왜 발생하는것일까?

기본적으로, JavaScript에서 지원하는 비교연산자에는

1.strict equality comparison operator(===, !==)과 

2.type-converting equality comparison operator(==, !=)가 있다.

'==='연산자(strict comparison)는 각 피연산자가 반드시 같은 type이어야 하고, 문자열에서는 각 문자열의 문자, 위치, 순서가 완전히 일치할 경우에만 true가 리턴된다.

반면에 '=='연산자(type-converting comparison) 는 각 피연산자가 다른 type이더라도 비교를 시도하고 일치하면 true를 리턴한다.

이 때문에 '=='연산자는 의도치 않은 오류를 불러올 수 있는 문제를 갖고있다.

그렇기 때문에 비교연산이 필요한 대부분의 상황에서 '==='연산자 사용을 권장한다. 

아래 코드에서 '=='연산자의 특성을 확인할 수 있다.

'' == '0'
false

0 == ''
true

0 =='0'
true

false == 'false'
false

false == '0'
true

false == undefined
false

false == null
false

null == undefined
true