NaN(Not a Number)은 자기 자신과도 같지 않은 유일한 값입니다. 다른 모든 값들은 자기 자신과 비교하면 항상 같다고 판단되지만, NaN만은 예외적으로 자기 자신과의 비교에서도 같지 않다는 결과가 나옵니다.
예제 1: 일반적인 동등 연산자(==)로 비교하기
<html>
<body>
<script>
var val = 54/"the";
document.write(val);
document.write("</br>");
if(val == NaN) {
document.write("NaN is equal to NaN");
}
else {
document.write("check in another way");
}
</script>
</body>
</html>출력 결과
NaN check in another way
위 예제에서 볼 수 있듯이, 54/"the"와 같은 잘못된 연산의 결과는 NaN이 되지만, 이를 == 연산자로 NaN과 비교하면 false가 반환됩니다. 즉, 일반적인 동등 비교(==)나 일치 비교(===)로는 NaN을 제대로 판별할 수 없습니다.
왜 별도의 조건이 필요한가?
실제 개발 과정에서는 어떤 값이 NaN인지 아닌지를 판별해야 하는 경우가 종종 발생합니다. 하지만 앞서 설명했듯이 NaN은 자기 자신과도 같지 않기 때문에, 기존의 비교 방식으로는 조건문을 구성할 수 없습니다. 이러한 문제를 해결하기 위해 ES6(ECMAScript 2015)에서 새로운 메서드가 도입되었습니다.
해결 방법: Object.is() 사용하기
ES6에서 제공하는 Object.is() 메서드를 사용하면 NaN이 NaN인지 정확하게 확인할 수 있습니다. 이 메서드는 두 값이 같은 값인지 비교하며, 특수한 경우인 NaN과 -0에 대해서도 정확한 결과를 반환합니다.
예제 2: Object.is()로 NaN 판별하기
<html>
<body>
<script>
var val = 54/"the";
document.write(val);
document.write("</br>");
document.write(Object.is(val,NaN));
</script>
</body>
</html>출력 결과
NaN true
실행 결과 true가 출력된 것을 확인할 수 있습니다. Object.is()는 NaN과 NaN을 같은 값으로 올바르게 판별해 줍니다.
추가 팁: isNaN()과 Number.isNaN()
NaN을 확인하는 또 다른 방법으로 전역 함수 isNaN()이 있지만, 이 함수는 값을 숫자로 강제 변환한 후 검사하기 때문에 의도치 않은 결과가 나올 수 있습니다. 따라서 더 안전한 방법은 ES6에서 도입된 Number.isNaN()을 사용하는 것입니다. 이 함수는 오직 실제 NaN 값에 대해서만 true를 반환하므로 가장 신뢰할 수 있는 방법 중 하나입니다.