자바스크립트 소수점 둘째자리 버림 - jabaseukeulibteu sosujeom duljjaejali beolim

자바스크립트(Javascript) 소수점 자리수, 올림, 버림, 반올림, 원단위 절삭

1. 소수점 올림, 버림, 반올림

Math.ceil() : 소수점 올림, 정수형 반환

Math.floor() : 소수점 버림, 정수형 반환

Math.round() : 소수점 반올림, 정수형 반환

 
var n = 123.456;
alert(Math.ceil(n)); // 124
alert(Math.round(n)); // 123

n = 123.567;
alert(Math.ceil(n)); // 124
alert(Math.floor(n)); // 123
alert(Math.round(n)); // 124 
 

2. 소수점 자리수 표기

toFiexed() : 숫자를 문자열로 변환하면서 지정된 소수점 이하 숫자를 반올림하여 출력한다.

toExponential() : 숫자를 문자열로 변환하면서 소수점 앞의 숫자 하나와 지정된 개수의 소수점 이후 숫자로 구성되는 지수표기법을 사용하여 출력한다.

toPrecision() : 지정된 수의 유효 숫자 개수만큼 숫자로 출력한다. 만약 유효 숫자 갯수가 숫자의 정수부분 전체를 출력할 만큼 충분하지 않으면 지수 표기법으로 출력된다.

위 세 가지 Method는 모두 반올림하여 출력된다.

 
var n = 123.456;

alert(n.toFixed(0)); // 123
alert(n.toFixed(2)); // 123.46 

alert(n.toExponential(1)); // 1.2e+2
alert(n.toExponential(3)); // 1.235e+2

alert(n.toPrecision(2)); // 1.2e+2
alert(n.toPrecision(4)); // 123.5
alert(n.toPrecision(7)); // 123.4560 
 

3. 원단위 절사

원단위의 경우 10, 십원단위의 경우 100, 백원단위의 경우 1000, ... 을 이용하면 원단위 절사가 가능하다.

 
var n = 2117;

n = Math.floor(n/10) * 10; // 10으로 나누면 211.7, floor 함수로 소수점을 버리면 211, 다시 10을 곱하면 2110
alert(n); // 2110 

Javascript에서 소수점 정리할 수 있는 함수에 대해 알아보겠습니다. 간단히 사용할 수 있는 함수는 Math 객체에 있는 ceil(), floor(), round() 메서드와 toFixed() 함수가 있습니다.

1. Math 객체 메서드

Math.ceil() : 올림

Math.floor() : 버림

Math.round() : 반올림

이 메서드들은 소수점 첫째 자리에서 올림이나 버림, 반올림을 해서 정수로 값을 나타내주는 역할을 합니다. 

다음 예제를 보면서 실제 변환되는 값을 확인해보겠습니다.

<script>

    /* 올림 */
    Math.ceil(10.1); //11
    Math.ceil(10.1534); //11
    Math.ceil(-10.9); //-10
    Math.ceil(-10.919); //-10

    /* 내림 */
    Math.floor(10.9); //10
    Math.floor(10.919); //10
    Math.floor(-10.1); //-11
    Math.floor(-10.153); //-11

    /* 반올림 */
    Math.round(10.1); //10
    Math.round(10.1534); //10
    Math.round(10.9); //11
    Math.round(10.919); //11
    
    Math.round(-10.9); //-11
    Math.round(-10.919); //-11
    Math.round(-10.1); //-10
    Math.round(-10.153); //-10

</script>

위 예제를 보면 3가지 메서드 모두 소수점 자리수와 상관없이 소수점 첫째 자리를 기준으로 값을 처리하는 것을 확인하실 수 있습니다.

ceil()의 경우 값이 양수이면 소수점 첫째자리 수가 1이상이면 무조건 값을 올려주고 음수이면 소수점 첫째자리 수에 상관없이 모두 값을 버려줍니다.

floor()의 경우 값이 양수이면 소수점 첫째자리 수에 상관없이 모두 값을 버려주고 음수이면 소수점 첫째자리 수가 1이상인 경우 값을 내려줍니다.

round()의 경우 소수점 첫째자리 수가 5이상이면 올림, 5미만이면 버림으로 값을 나타내줍니다.

2. .toFixed() 함수

위에서 사용한 Math 객체 메서드의 경우 값이 정수로만 표현된다는 단점이 있습니다. 만약 원하는 소수점 자리 수까지 나타내주기 위해서는 .toFixed() 함수를 사용해야 합니다.

간단한 예제를 통해서 .toFixed() 함수의 기능을 확인해보겠습니다.

<script>
    var n = 98.56321;
    var m = -98.56321;
    
    n.toFixed(0); //99
    n.toFixed(1); //98.6
    n.toFixed(2); //98.56
    n.toFixed(3); //98.563
    n.toFixed(5); //98.56321
    n.toFixed(10); //98.5632100000

    m.toFixed(0); //-99
    m.toFixed(1); //-98.6
    m.toFixed(2); //-98.56
    m.toFixed(3); //-98.563
    m.toFixed(5); //-98.56321
    m.toFixed(10); //-98.5632100000
</script>

위 예제와 같이 .toFixed() 함수를 사용하면 원하는 자리 수까지 값을 표현해줄 수 있습니다. 자리 수가 0일 경우 소수점 첫째자리에서 0의 자리까지 반올림을 해주고 1일 경우는 소수점 둘째자리에서 1의 자리까지 반올림을 해줍니다. 실수의 소수점 자리 수보다 많이 설정할 경우 그 값들은 자리 수만큼 0으로 표현됩니다. 

자리 수는 0부터 100까지의 값만 허용되며 음수나 100을 초과하는 값을 입력할 경우 에러가 발생하게 됩니다. 

javascript에서 2 decimal (소수점 2자리)로 round하려면, 해당 함수가 없답니다.

방법은 다음과 같이 하면 처리가 가능합니다.

[방법1] 곱셈 나눗셈 방식

Math.round(num * 100) / 100

해당 방식으로 하면, 신기하게, 소수점 2자리에서 짤리게 됩니다.

참고: http://stackoverflow.com/questions/11832914/round-to-at-most-2-decimal-places

[방법2] .toFixed()를 이용한 소수점 반올림

var twoPlacedFloat = parseFloat(yourString).toFixed(2)

결과 값 >>

parseFloat("1.555").toFixed(2);
"1.55"parseFloat("1.556").toFixed(2);
"1.56"

다음과 같은 현상으로

소수점을 반올림을 할때는 .toFixed()를 사용하는 것이 바람직합니다.

parserFloat와 Math.round 비교 

parseFloat("1.555").toFixed(2);
"1.55"

parseFloat("1.556").toFixed(2);
"1.56"


// OMG - 이런 문제도 있군요.
parseFloat("1.5551").toFixed(2); // Returns 1.56 as expected.
parseFloat(1.3555).toFixed(2); // Returns 1.36
parseFloat(1.355).toFixed(2); // Returns 1.35 왜? 1.36이 아닐까요?


Math.round(1.555*100)/100; //(주의) 5이상의 반올림
1.56

Math.round(1.555*1000)/1000;
1.555

참고: http://stackoverflow.com/questions/4435170/parse-float-with-two-decimal-places

이상한 Javascript의 .toFixed()의 환산법??

5의 앞자리가 짝수이면 반올림? 아니면 내림? 현상이 발생하는 것일까요?

해당 현상은 2진수의 문제 때문입니다.

Warning: Floating point numbers cannot represent all decimals precisely in binary.
This can lead to unexpected results, such as 0.1 + 0.2 === 0.3 returning false .

부동 소수점 숫자는 모든 소수를 2진수로 정확하게 나타낼 수 없습니다.
이로 인해 0.1 + 0.2 === 0.3 공식의 결과를 false값이 나옵니다.
이처럼, 예기치 않은 결과가 발생 할 수 있습니다.

(참고)

.toFixed() developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed

Number.prototype.toFixed() - JavaScript | MDN

Number.prototype.toFixed() The toFixed() method formats a number using fixed-point notation. toFixed() toFixed(digits) digits Optional The number of digits to appear after the decimal point; this may be a value between 0 and 20, inclusive, and implementati

developer.mozilla.org

(참고)
부동소수점 ko.wikipedia.org/wiki/%EB%B6%80%EB%8F%99%EC%86%8C%EC%88%98%EC%A0%90

부동소수점 - 위키백과, 우리 모두의 백과사전

위키백과, 우리 모두의 백과사전. 초기의 전기기계식 프로그래밍 가능한 컴퓨터 Z3에는 부동소수점 산술 기능이 포함되었다. (뮌헨의 국립 독일 박물관) 부동소수점(浮動小數點, floating point) 또

ko.wikipedia.org

Javascript 숫자는 항상 64비트 부동 소수점

이런 형상은 원인은 Javascript가 숫자는 항상 64bit 부동 소수점이라서 군요.

국제 IEEE 754 표준에 따라 배정 밀도 부동 소수점 숫자로 저장됩니다.

수(비율)이 비트에 저장된 64비트의 저장 형식이 숫자 0 내지 51비트 52비트 내지 62의 지수 비스 및 63에서 기호

(기간 또는 지수 표기가 없는 번호) 정수는 15자리의 정확도까지 입니다.

(출처: Javascript 소수점 계산 오류? 소수점 계산 해결 방법)

수학에서의 반올림

사사오입

사사오입(四捨五入)
십진법에서는 다음과 같이 반올림을 한다.
4 이하이면 0으로 버리고 5 이상이면 0으로 버린 후 윗자리에 1을 더한다.

[사사오입의 예제]

51.6137

• 소수점 넷째 자리에서 반올림: 51.614
• 소수점 셋째 자리에서 반올림: 51.61
• 소수점 둘째 자리에서 반올림: 51.6
• 소수점 첫째 자리에서 반올림: 52
• 일의 자리에서 반올림: 50
• 십의 자리에서 반올림: 100

오사오입

반올림에서 5 미만의 숫자는 버림하며 5 초과의 숫자는 올림한다.

5의 경우에는 5의 앞자리가 홀수인 경우엔 올림을 하고 짝수인 경우엔 버림을 하여 짝수로 만들어준다.

예를 들어 53.45는 53.4로, 32.75는 32.8로 반올림한다.

이를 오사오입(round-to-nearest-even)이라고 한다. 

자연과학 및 공학의 유효 숫자에서 많이 쓴다.

오사육입

사사오입과는 반대로 5를 버리는 방법이다. 5 초과 올림, 5 미만 내림은 동일하다.

참고: ko.wikipedia.org/wiki/%EB%B0%98%EC%98%AC%EB%A6%BC

반올림 - 위키백과, 우리 모두의 백과사전

위키백과, 우리 모두의 백과사전. 사사오입은 여기로 연결됩니다. 대한민국의 제2차 헌법 개헌에 대해서는 사사오입 개헌 문서를 참조하십시오. 반올림(半-)은 근삿값을 구하는 방법 중 하나이

ko.wikipedia.org

도움이 되셨다면 하트모양의 "♡ 공감"을 눌러주시면 큰 격려가 됩니다.
(로그인하지 않으셔도 가능)