[javascript & jquery] javascript & jquery를 활용한 다양한 숫자 체크

1. isNaN

   - 해당 함수를 사용하면 값이 숫자가 아니라면 true 맞다면 false를 리턴한다. 즉, 값이 숫자인 애들을 true로 반환하려면 반대로 선언해야 한다. (ex : !isNaN( vlaue ) 

!isNaN( "-10" ) // true
!isNaN( "+10" ) // true
!isNaN( "0" ) // true
!isNaN( "0xFF" ) // true
!isNaN( "8e5" ) // true
!isNaN( "3.1415" ) // true
!isNaN( "0144" ) // true
!isNaN( ".423" ) // true
!isNaN( "" ) // true
!isNaN( "432,000" ) // false
!isNaN( "23,223.002" ) // false
!isNaN( "3,23,423" ) // false
!isNaN( "-0x42" ) // false
!isNaN( "7.2acdgs" ) // false
!isNaN( {} ) // false
!isNaN( NaN ) // false
!isNaN( null ) // true
!isNaN( true ) // true
!isNaN( false ) // true
!isNaN( Infinity ) // true
!isNaN( undefined ) // false

* 확인 결과 " ", null, true, false, Infinity 등과 같은 값은 숫자가 아닌데 숫자로 체크하고 있다. 즉, 알고만 있고 사용은 하지말자.

2. jQuery.isNumeric( value ) 

    - 해당 함수는 value가 숫자인지 체크해서 boolean 값으로 반환한다. 16진수, 10진수 모두 체크하여 true로 반환해주며 isNaN에서 있던 오류는 없어서 숫자형 체크에는 유용하게 사용할 수 있다.

$.isNumeric( "-10" ) // true
$.isNumeric( "+10" ) // true
$.isNumeric( "0" ) // true
$.isNumeric( "0xFF" ) // true
$.isNumeric( "8e5" ) // true
$.isNumeric( "3.1415" ) // true
$.isNumeric( "0144" ) // true
$.isNumeric( ".423" ) // true
 
$.isNumeric( "" ) // false
$.isNumeric( "432,000" ) // false
$.isNumeric( "23,223.002" ) // false
$.isNumeric( "3,23,423" ) // false
$.isNumeric( "-0x42" ) // false
$.isNumeric( "7.2acdgs" ) // false
$.isNumeric( {} ) // false
$.isNumeric( NaN ) // false
$.isNumeric( null ) // false
$.isNumeric( true ) // false
$.isNumeric( false ) // false
$.isNumeric( Infinity ) // false
$.isNumeric( undefined ) // false

     

3. 위의 1번과 2번의 문제 및 보완사항을 해소한 정규식을 사용해서 만든 함수이다.

function isNumeric(num, opt){
  // 좌우 trim(공백제거)을 해준다.
  num = String(num).replace(/^\s+|\s+$/g, "");
 
  if(typeof opt == "undefined" || opt == "1"){
    // 모든 10진수 (부호 선택, 자릿수구분기호 선택, 소수점 선택)
    var regex = /^[+\-]?(([1-9][0-9]{0,2}(,[0-9]{3})*)|[0-9]+){1}(\.[0-9]+)?$/g;
  }else if(opt == "2"){
    // 부호 미사용, 자릿수구분기호 선택, 소수점 선택
    var regex = /^(([1-9][0-9]{0,2}(,[0-9]{3})*)|[0-9]+){1}(\.[0-9]+)?$/g;
  }else if(opt == "3"){
    // 부호 미사용, 자릿수구분기호 미사용, 소수점 선택
    var regex = /^[0-9]+(\.[0-9]+)?$/g;
  }else{
    // only 숫자만(부호 미사용, 자릿수구분기호 미사용, 소수점 미사용)
    var regex = /^[0-9]$/g;
  }
 
  if( regex.test(num) ){
    num = num.replace(/,/g, "");
    return isNaN(num) ? false : true;
  }else{ return false;  }
}

// isNumeric함수의 결과
isNumeric( "-10" ) // true
isNumeric( "+10" ) // true
isNumeric( "-10", 2 ) // false
isNumeric( "+10", 2 ) // false
isNumeric( "0" ) // true
isNumeric( "0xFF" ) // false
isNumeric( "8e5" ) // false
isNumeric( "3.1415" ) // true
isNumeric( "3.1415", 4 ) // false
isNumeric( "0144" ) // true
isNumeric( ".423" ) // false
isNumeric( "" ) // false
isNumeric( "432,000" ) // true
isNumeric( "432,000", 3 ) // false
isNumeric( "23,223.002" ) // true
isNumeric( "3,23,423" ) // false
isNumeric( "-0x42" ) // false
isNumeric( "7.2acdgs" ) // false
isNumeric( {} ) // false
isNumeric( NaN ) // false
isNumeric( null ) // false
isNumeric( true ) // false
isNumeric( false ) // false
isNumeric( Infinity ) // false
isNumeric( undefined ) // false