NaN 은 Not a Number 의 약자로 말 그대로 숫자가 아닌, 또는 될 수 없는 것들을 뜻한다.
var x = 100 / "apple" 를 하게 되면 x 는 NaN이 된다.
하지만
var x = 100/"10" ; 을 하면 결과는 10이 나온다. 즉, 문자열이 숫자값으로 변환할 수 있으면 숫자로 변환해 계산을 해준다.
var x = 100 / "apple" 을 하게 되면 x는 NaN 값이 나오게 되는데
이런 NaN 값을 체크 하는 것이 isNaN() 메소드이다.
x를 isNaN() 메소드에 넣으면 -> isNaN(x) // true;
가 나오게 된다.
1 2 3 4 5 6 7 8 9 10 | <!DOCTYPE html> <html> <body> <p id="demo"></p> <script> var dd =100/"Apple"; document.getElementById("demo").innerHTML =isNaN(dd); </script> </body> </html> Colored by Color Scripter |
그리고
var x = NaN ;
var y = 5;
var z = x + y; 를 하게 되면 NaN이 나오게 된다. 하지만 다음과 같이
var x = NaN;
var y = "5";
var z = x + y;
를 하게 되면 결과는 NaN5가 나오게 된다.
이러한 특징이 존재한다.
그러나 typeof(NaN)을 해보면 number가 나온다. 즉 숫자라고..
이게 참 웃기다.
이걸 적용할 수 있는 예제는 아래와 같다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <h1>해당 월의 총 날짜</h1> 월입력 : <input type="text" id="month"><br> <input type="button" id="okBtn" value="확인"> <p id="result"> 월을 입력하고 확인 버튼을 누르시오. </p> </body> </html> <script> var month = 0; var okBtn = document.getElementById("okBtn"); var result = document.getElementById("result"); okBtn.onclick = function(){ month = parseInt(document.getElementById("month").value); //숫자 변환 가능 -> 숫자변환 //숫자 변환 불가능 -> NaN; if(isNaN(month)){ result.innerHTML = "문자열은 불가능합니다."; return; } } </script> Colored by Color Scripter |
월을 입력 받아야하는데(숫자) input으로 들어온 값은 문자열이다. 그래서 ParseInt(혹은 Number)로 변환해줘야 한다.
하지만 이 input값에 숫자가 아닌 문자열을 놓게 되면 변환이 불가능해서 NaN이 나오게 된다. 문자열이 들어오게 되면 더 이상의 흐름을 끊어야 하기 때문에 return하게 된다.
이렇게 응용할 수 있다.
반응형
그리드형
'javascript' 카테고리의 다른 글
| 자바스크립트 Math (0) | 2017.08.16 |
|---|---|
| 자바스크립트 Number(), parseInt(), parseFloat(). 문자를 숫자로 변환 (0) | 2017.08.16 |
| 자바스크립트 이벤트(mouseover, mouseenter, onclick, over시 이미지 변경), 문자열 (0) | 2017.08.16 |
| 자바스크립트 계산기 만들기 (0) | 2017.08.16 |
| 자바스크립트 object, null, undefined, 함수(function) (0) | 2017.08.16 |
