[JavaScript] '===' 연산자 vs '==' 연산자

이번 포스팅에서는 자바스크립트에서 두 값이 동일한지 비교하는 데 사용되는 비교 연산자인 '===' 연산자와 '==' 연산자의 차이에 대하여 공부를 해보고자 한다.

 

---

'===' 연산자

'===' 연산자는 엄격한 비교(strict comparison)를 수행한다.

이 연산자를 사용하면 두 피연산자의 값과 타입이 정확히 일치하는지 확인한다.

 

즉, 값과 타입이 동일한 경우에만 true를 반환합니다.

값이 동일하지만 타입이 다른 경우나 값과 타입이 모두 다른 경우에는 false를 반환합니다.

 

예시 코드

5 === 5 // true
5 === '5' // false

• 첫 번째 표현식에서는 두 피연산자의 값과 타입이 모두 정확히 일치하므로 true를 반환한다.
• 두 번째 표현식에서는 첫 번째 피연산자의 타입이 숫자이고 두 번째 피연산자의 타입이 문자열이므로 값은 동일하지만 타입이 다르다.
• 따라서 '===' 연산자는 false를 반환합니다.

 

---

'==' 연산자

'==' 연산자는 동등한 비교(loose comparison)를 수행한다.

이 연산자를 사용하면 두 피연산자의 값이 같은지 확인하되, 필요한 경우 자동으로 타입 변환을 수행한다.

 

즉, 값만 같다면 true를 반환한다.

타입이 다른 경우에는 값의 타입을 변환하여 비교한다.

 

예시 코드

5 == 5 // true
5 == '5' // true

• 첫 번째 표현식에서는 두 피연산자의 값이 정확히 일치하므로 true를 반환한다.
• 두 번째 표현식에서는 첫 번째 피연산자의 타입이 숫자이고 두 번째 피연산자의 타입이 문자열이므로 '==' 연산자는 두 번째 피연산자를 숫자로 변환한 후에 값이 같은지 비교한다.
• 따라서 '==' 연산자도 true를 반환한다.

 

'==' 연산자는 타입 변환이 자동으로 이루어지기 때문에 예상치 못한 결과를 초래할 수 있으므로 일반적으로 '===' 연산자를 사용하는 것이 권장된다.
엄격한 비교를 수행함으로써 타입 일치성을 명시적으로 확인할 수 있고, 코드의 가독성과 안정성을 높일 수 있다.

 

---