[JS] 문자열 내에서 숫자인지 체크하는 방법에 대한 고민...(isNaN vs. Number.isNaN)

Javascript에서 데이터가 숫자인지 여부를 파악하는 방법에 대해 다룬다.

1. 범위를 이용한 방법

if( x >= 0 && x <=9){
  ...
}

2. isNaN()을 이용하는 방법

if(!isNaN(x)){
...
}

isNaN의 문제점

isNaN은 내부적으로 인자를 먼저 Number()로 타입캐스팅된다. 그래서 본래 인자가 NaN임에도 불구하고 NaN로 판정되지 않는 경우가 있다. 아래는 그 예시다.
(참조: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/isNaN)

isNaN(true);      // 거짓
isNaN(null);      // 거짓
isNaN(37);        // 거짓

// 문자열
isNaN("37");      // 거짓: "37"은 NaN이 아닌 숫자 37로 변환됩니다
isNaN("37.37");   // 거짓: "37.37"은 NaN이 아닌 숫자 37.37로 변환됩니다
isNaN("123ABC");  // 참: parseInt("123ABC")는 123이지만 Number("123ABC")는 NaN입니다
isNaN("");        // 거짓: 빈 문자열은 NaN이 아닌 0으로 변환됩니다
isNaN(" ");       // 거짓: 공백이 있는 문자열은 NaN이 아닌 0으로 변환됩니다

// dates
isNaN(new Date());                // 거짓
isNaN(new Date().toString());     // 참

// 이것이 허위 양성이고 isNaN이 완전히 신뢰할 수 없는 이유이다.
isNaN("blabla")   // 참: "blabla"는 숫자로 변환됩니다.
                  // 이것을 숫자롯 parsing 하는 것을 실패하고 NaN을 반환한다.

2_2. Number.isNaN()

글로벌 함수 isNaN() 보다는 엄격한 버전이다. 숫자를 담고있는 문자열("12")과 문자 모두 false를 반환하기 때문에 문자열 내의 문자가 숫자인지 체크를 하기 위해 사용하는 것은 부적절하다.

Number.isNaN('12')
false
Number.isNaN('*')
false
Number.isNaN(12)
false

3. isNaN() 함수에 대한 나의 생각...

isNaN() 함수가 문자열 내의 문자가 숫자임을 체크하는 방법으로 사용하는 것은 몇 가지 위험성도 존재한다. 하지만, 몇 가지 주의 점을 고려하여 사용한다면 가독성이나 코드 양을 줄일 수 있는 방법이 될 수 있을 것 같다.