[javascript] 자바스크립트 isNaN 함수 정리

 

 

안녕하세요!

 

오늘은 자바스크립트의 기본 내장 함수인 isNaN 함수에 대해 자세히 포스팅하려고 합니다. 자바스크립트를 이용하여 개발을 하다 보면 사용자 인터페이스(UI)에서 숫자형 데이터를 판별하는 상황이 빈번하게 발생합니다. 이럴 때 저 또한 isNaN 함수를 자주 활용하고 있습니다.

isNaN 함수는 "Is Not a Number"의 줄임말로, 주어진 값이 숫자가 아닌지를 확인하는 역할을 합니다. 이 함수의 특징과 사용 방법을 하나씩 정리해 보도록 하겠습니다.

 

---

IsNaN 함수의 특징

1. isNaN 함수는 주어진 값이 숫자가 아닌 경우 true를 반환하고, 숫자인 경우 false를 반환합니다.

 

2. 숫자가 아닌 경우, NaN(Not a Number) 값을 반환합니다.

 

3. NaN은 자바스크립트의 특수한 값으로, 다른 숫자와 비교하더라도 항상 false를 반환합니다.

 

---

숫자로 판별하는 예시 코드

isNaN('');
isNaN(true);
isNaN(false);
isNaN(null);
isNaN(Infinity);
isNaN([]);
isNaN(0);
isNaN('0');
isNaN(1 + 2);
isNaN(-12);
isNaN('1' + '2');
isNaN(new Date());

1. isNaN('')
빈 문자열은 숫자로 변환될 수 없으므로 true를 반환합니다.

2. isNaN(true)
true는 숫자로 변환될 수 없으므로 true를 반환합니다.

3. isNaN(false)
false는 숫자로 변환될 수 없으므로 true를 반환합니다.

4. isNaN(null)
null은 숫자로 변환될 수 없으므로 true를 반환합니다.

5. isNaN(Infinity)
Infinity는 숫자로 변환될 수 있지만, isNaN 함수는 숫자 자체를 판별하는 것이 아니라, 숫자로 변환 가능한지를 판별합니다. 따라서, 숫자로 변환 가능하므로 false를 반환합니다.

6. isNaN([])
빈 배열은 숫자로 변환될 수 없으므로 true를 반환합니다.

7. isNaN(0)
0은 숫자이므로 숫자로 판별되어 false를 반환합니다.

8. isNaN('0')
'0'은 숫자로 변환 가능하며, 숫자 0으로 변환될 수 있습니다. 따라서 false를 반환합니다.

9. isNaN(1 + 2)
1 + 2의 결과는 3이며, 3은 숫자이므로 false를 반환합니다.

10. isNaN(-12)
-12는 숫자이므로 false를 반환합니다.

11. isNaN('1' + '2')
'1'과 '2'를 문자열로 합치면 '12'가 됩니다. '12'는 숫자로 변환될 수 없으므로 true를 반환합니다.

12. isNaN(new Date())
new Date()는 날짜 객체이므로 숫자로 변환될 수 없으므로 true를 반환합니다.

위의 예시 코드들은 isNaN 함수를 사용하여 주어진 값이 숫자로 판별되는지를 확인한 결과를 보여주고 있습니다. isNaN 함수는 입력값을 숫자로 변환할 수 있는지를 판별하며, 숫자로 변환 가능한 경우 false를 반환하고, 그렇지 않은 경우 true를 반환합니다. 이를 활용하여 자바스크립트에서 숫자 형태로 데이터를 판별하는 데 도움이 됩니다.

---

문자로 판별하는 예시 코드

isNaN();
isNaN(undefined);
isNaN({});
isNaN('abc');
isNaN('1 + 2');
isNaN(new Date().toString());

1. isNaN()
인자로 아무 값도 주어지지 않은 경우, isNaN 함수는 변환할 값이 없으므로 true를 반환합니다.

2. isNaN(undefined)
undefined는 숫자로 변환될 수 없으므로 true를 반환합니다.

3. isNaN({})
객체({})는 숫자로 변환될 수 없으므로 true를 반환합니다.

4. isNaN('abc')
'abc'는 숫자로 변환될 수 없는 문자열이므로 true를 반환합니다.

5. isNaN('1 + 2')
'1 + 2'는 숫자로 변환될 수 없는 문자열이며, 식으로 인식되지 않으므로 true를 반환합니다.

6. isNaN(new Date().toString())
new Date().toString()은 날짜를 문자열로 변환한 값이므로 숫자로 변환될 수 없으므로 true를 반환합니다.

위의 예시 코드들은 isNaN 함수를 사용하여 주어진 값이 숫자로 변환될 수 있는지를 확인한 결과를 보여주고 있습니다. isNaN 함수는 입력값을 숫자로 변환할 수 있는지를 판별하며, 숫자로 변환 가능한 경우 false를 반환하고, 그렇지 않은 경우 true를 반환합니다. 이를 활용하여 자바스크립트에서 문자열 형태로 데이터를 판별하는 데 도움이 됩니다.

 

---

최종 정리

 

오늘은 자바스크립트의 isNaN 내장 함수에 대해 간단히 정리해 보았습니다. 이 함수의 기능은 의외로 간단하지만, 오늘 정리한 다양한 예시를 통해 다양한 케이스에서 활용할 수 있다는 것을 알게 되었습니다. 업무에서는 오늘 정리한 내용보다는 자주 사용되지 않을 수도 있지만, 언제든지 필요한 상황에서 유용하게 활용될 수 있습니다.

isNaN 함수는 자바스크립트에서 숫자 판별에 유용한 도구로, 입력값을 숫자로 변환할 수 있는지를 판별하는데 활용됩니다. 주어진 값이 숫자로 변환 가능하면 false를 반환하고, 그렇지 않은 경우 true를 반환합니다. 이를 통해 사용자 입력의 유효성 검사나 숫자 계산에 대한 안전성을 확보하는 데 도움이 됩니다.

 

 

그럼 오늘도 저의 글을 읽어주셔서 감사합니다.