[Javascript] ==와===의 차이

Javascript를 사용 중에 값을  비교해야 할 때가 있는데, 이때 비교연산자인 ==연산자와 ===연산자를 사용한다.

두 연산자 모두 비교한 피연산자 값이 일치하면 ture값을 반환하고 비교한 피연산자 값이 일치하지 않으면 false를 반환한다. 값을 비교할 때, 가능한 ==연산자를 사용하지 않도록 하고, ===연산자를 사용할 것을 권장하고 있다.

 

== 연산자는 Equal Operator(비교연산자), ===연산자는 Strict Equal Operator(엄격한 비교 연산자)이다.

두 연산자를 코드를 통해 쉽게 예를 들어 보자면 아래와 같다. 

 

1. ==연산자

100 == 100        // true
100 == '100'      // true
1 == true         // true
true == 'true'    // true
null == undefined // true

 ==연산자는 두 값을 비교해서 같으면 true 다르면 false 값을 리턴하되, 두 피연산자 값이 서로 타입이 다를 경우에는 자동으로 일부 피연산자의 타입을 변환한 후에 값을 비교한다.

 

2. ===연산자 

100 === 100        // true
100 === '100'      // false
1 === true         // false
true === 'true'    // false
null === undefined // false

NaN === NaN        // false

피연산자 값의 타입이 서로 다르면 자동으로 타입을 반환해 주는 ==연산자와 달리  ===연산자는 두 피연산자 값의 타입이 서로 다르더라도 변환하지 않고 있는 그대로의 값을 비교하는 방식으로 엄격하게 값을 비교한다.

 

또한 위의 코드에서 알 수 있듯이 NaN 값은 자기 자신을 포함하여 어떠한 값과도 일치하지 않는다. 즉, NaN 값과 비교하게 되면 항상 false의 값이 반환된다. 

 

3. 권장 사항

== 연산자는 타입이 다르면 변환해주기 때문에 내가 원치 않는 값이 발생할 수 있고, 이를 판별하기가 쉽지 않다. 때문에 가능한 == 연산자를 사용하지 않고 확실한 비교가 보장되는 ===연산자를 사용하여 변환이 필요할 때, 내가 직접 자료형을 변환하여 보다 코드의 가독성을 높이는 것을 권장한다.