본문 바로가기
programming/javascript

자바스크립트 소숫점 고정 toFixed() 메서드 사용하기 using javascript tofixed method

by 개코 - 개발과 코딩 2021. 12. 4.

자바스크립트는 toFixed() 메서드를 사용하여 소숫점을 고정할 수 있다. 금액표시를 위한 상황이거나 수치를 일관적으로 입력할 때 가시적으로 구분을 하기 편하게 하기 위함이 크다. 하지만, toFixed() 메서드라고 해도 허점이 있다. 끊기는 자리에 따라 반올림이 될 수 있다는 점이다.

자바스크립트 소숫점 고정 toFixed() 메서드 사용하기
using javascript tofixed method

자바스크립트에서 소숫점을 다룰 떄 특정 자릿수까지만 고정을 시킬필요가 있다.

이 경우 toFixed() 메서드를 사용하면 편리하다.

이런 숫자를 사용하는 경우는 은행의 전표나 영수증과 같은 금액적인 표시를 위해 사용되기도 하며

자재나 또는 숫자를 표기할 때 일관된 수치를 보여줄 때 많이 사용된다.

소숫점 고정 toFixed() 메서드

숫자를 표현하는 방법은 다양하지만 국내의 경우 우측정렬이며 점과 쉼표를 사용한다.

일관된 자리수를 고수하는데 이것은 가독성과 사용자로 하여금 숫자의 빠른 인식을 위함에 있다.

전산과 프로그래밍에서 숫자는 민감하기 떄문이기도 하다.

특히, 돈이 오가는 상황이라면 더욱 그렇다.

그런면에서 toFixed() 메서드는 편리하지만 단점이 있다.

소숫점이 6이상으로 끝나는 경우 자릿수가 줄어들 경우 반올림된다.

사용법은 아래와 같다.

Number.toFixed(자릿수)

샘플코드

toFixed() 메서드를 위한 자바스크립 예제를 만들어 본다.

소숫점을 길게 잡고 여러 상황에 맞게 만들어 보고 비교를 해 본다.

아래의 코드를 보면 일부러 숫자를 길게 잡고 5와 6를 넣었다.

toFixed() 함수가 동작하면서 반올림되는 것을 비교하기 위함이다.

<!DOCTYPE html>
<html>
    <body>

        <h2>자바스크립트 숫자형</h2>
        <div id="cont">
            <p id="ret1"></p>
            <p id="ret2"></p>
            <p id="ret3"></p>
            <p id="ret4"></p>
            <p id="ret5"></p>
        </div>

        <script>
            
            console.log("----------");
            
            let vNum = 6.6565656565656;
            let vExp;

            vFix = vNum.toFixed(0);
            console.log(typeof(vFix), vFix);
            document.getElementById("ret1").innerText = vFix;

            vFix = vNum.toFixed(2);
            console.log(typeof(vFix), vFix);
            document.getElementById("ret2").innerText = vFix;

            vFix = vNum.toFixed(4);
            console.log(typeof(vFix), vFix);
            document.getElementById("ret3").innerText = vFix;

            vFix = vNum.toFixed(6);
            console.log(typeof(vFix), vFix);
            document.getElementById("ret4").innerText = vFix;

            console.log("----------");

        </script>

    </body>
</html>

결과화면을 보자.

자릿수가 고정되는 것을 볼 수 있다.

하지만 6이상으로 자릿수가 끊겨 고정될 경우 반올림 되는 것을 볼 수 있다.

반응형

댓글