자바스크립트의 Number() 함수는 숫자형 데이터로 변환하는 함수이다. 많이 사용되는 함수이기도 하다. 문자열로 이루어진 데이터에서 숫자계산이 필요한 경우 이 함수를 사용하면 편하다. 숫자로 변환될 수 없는 경우 NaN 을 표시하기 때문에 검증과정 또한 편하게 할 수 있다.
자바스크립트 숫자 변환 Number 함수
using javascript Number function
자바스크립트에서 숫자로 변환하는 방법에는 3가지가 있었다.
Number(), parseInt(), parseFloat() 함수들이다.
이번에는 Number() 함수에 대해 파헤쳐 본다.
Number() 함수를 사용한다고 해도 모든 데이터를 숫자로 변환하지 않는다.
숫자로 인식되는 문자열만 인식되는 것에 주목하자.
숫자변환 Number() 함수
문자열이나 객체 데이터를 숫자로 변환하기 위해 Number() 함수를 사용한다.
자바스크립트가 묵시적으로 숫자형태의 문자열을 변환한다고는 하지만, 숫자 계산만큼은 가급적 숫자형태로 변환한 후에 계산하는 것을 권장한다.
Number() 함수를 사용하기 위해 해당 함수에 숫자형태의 데이터를 인자값으로 넣어주면 그만이다.
Number(숫자)샘플코드
Number() 함수를 사용한 간단한 자바스크립트 예제를 만들어 본다.
여러가지 형태로 만들어 눈으로 확인해 보는 것이 좋다.
혹여 나중에 실수를 방지하는 것이 목적이기도 하지만 특성을 아는 것 또한 중요하기 때문
이번에도 코드가 길지만 출력문 부분은 빼고 Number() 함수만 주목하도록 하자.
<!DOCTYPE html>
<html>
<body>
<h2>자바스크립트 숫자형 변환</h2>
<div id="cont">
<p id="ret4"></p>
<p id="ret5"></p>
<p id="ret6"></p>
<p id="ret7"></p>
<p id="ret8"></p>
<p id="ret1"></p>
<p id="ret2"></p>
<p id="ret9"></p>
<p id="ret10"></p>
<p id="ret3"></p>
</div>
<script>
console.log("----------");
vNumber = Number("13");
console.log(typeof(vNumber), vNumber);
document.getElementById("ret4").innerText = vNumber;
vNumber = Number(" 13");
console.log(typeof(vNumber), vNumber);
document.getElementById("ret5").innerText = vNumber;
vNumber = Number("13 ");
console.log(typeof(vNumber), vNumber);
document.getElementById("ret6").innerText = vNumber;
vNumber = Number(" 13 ");
console.log(typeof(vNumber), vNumber);
document.getElementById("ret7").innerText = vNumber;
vNumber = Number("13.13");
console.log(typeof(vNumber), vNumber);
document.getElementById("ret8").innerText = vNumber;
vNumber = Number(true);
console.log(typeof(vNumber), vNumber);
document.getElementById("ret1").innerText = vNumber;
vNumber = Number(false);
console.log(typeof(vNumber), vNumber);
document.getElementById("ret2").innerText = vNumber;
vNumber = Number("13,13");
console.log(typeof(vNumber), vNumber);
document.getElementById("ret9").innerText = vNumber;
vNumber = Number("13 13");
console.log(typeof(vNumber), vNumber);
document.getElementById("ret10").innerText = vNumber;
vNumber = Number("John");
console.log(typeof(vNumber), vNumber);
document.getElementById("ret3").innerText = vNumber;
console.log("----------");
</script>
</body>
</html>결과 화면을 보자.
숫자형태의 데이터가 숫자형 데이터타입으로 변환되어 출력되는 것을 볼 수 있다.
공백이 있더라도 숫자로 인식되면 변환이 된다.
하지만, 숫자로써 인식할 수 없다면 NaN ( Not a Number ) 를 표시한다.
'programming > javascript' 카테고리의 다른 글
| 자바스크립트 소숫점 변환 parseFloat 함수 사용 Using javascript parseFloat() Function (0) | 2021.12.09 |
|---|---|
| 자바스크립트 정수 변환 parseInt 함수 사용 Using javascript parseInt function (0) | 2021.12.09 |
| 자바스크립트 숫자 변환하기 convert to number (0) | 2021.12.07 |
| 자바스크립트 valueOf 메서드 사용 원시데이터의 변환 primitive value (0) | 2021.12.05 |
| 자바스크립트 숫자형 자리수 지정 toPrecision 메서드 사용 (0) | 2021.12.05 |
댓글