JavaScript에서 숫자를 반올림하는 방법은 무엇입니까? .toFixed ()는 문자열을 반환합니까?


176

여기에 뭔가 빠졌습니까?

var someNumber = 123.456;
someNumber = someNumber.toFixed(2);
alert(typeof(someNumber));
//alerts string

않는.toFixed()문자열을 반환?

숫자를 소수점 이하 두 자리로 반올림하고 싶습니다.


7
문자열을 반환하도록 설계 되었습니까?
kennytm

2
나에게 그것은 단지 이상해 보인다. .toFixed ()는 숫자에서만 작동합니다 ... 그렇죠?
Derek Adair

10
Math.round ()가 예상대로 작동한다는 것을 알고 있습니다. 난 그냥 숫자에서 작동하는 함수가 문자열을 반환하는 이유를 문의했다 ...
Derek Adair

3
2017 년에 거주하는 사람들은 lodash.com/docs/4.17.4#ceil
Yves M.

1
_도 마찬가지입니다. 카운트? 아직 그의 형제로 업그레이드되지 않았습니다.
Jenna Leaf

답변:


124

이진 부동 소수점 시스템에서는 0.1과 10 진수 분수를 표시하는 데 사용되는 제곱을 표현할 수 없기 때문에 문자열을 반환합니다.

예를 들어 0.1은 실제로 0.1000000000000000055511151231257827021181583404541015625이고 0.01은 실제로 0.01000000000000000020816681711721685132943093776702880859375입니다. ( BigDecimal내 요점을 증명해 주셔서 감사합니다 . :-P)

따라서 (소수점 부동 소수점 또는 유리수 유형 없음) 문자열로 출력하는 것이 표시에 필요한 정밀도로 정확하게자를 수있는 유일한 방법입니다.


28
적어도 자바 스크립트는 약간의 손가락 작업을 저장하고 다시 숫자로 변환 할 수 있습니다 ... sheesh ...
Derek Adair

10
@ 데릭 : 예, 일단 숫자로 다시 변환하면 동일한 부정확성 문제가 다시 발생합니다. :-P JS에는 십진 부동 소수점 또는 유리수가 없습니다.
Chris Jester-Young

1
@DerekAdair 나는 최근에 이것에 대해 더 자세히 설명하는 글을 작성했다. stackoverflow.com/a/27030789/13
Chris Jester-Young

7
실제로 이것은이 주제에 대해 꽤 많은 연구를하게했습니다! 모든 도움을 주셔서 감사합니다!
Derek Adair

2
당신의 대답은 약간 오도합니다 : toFixed서식 지정 함수는 숫자를 문자열로 변환하고 지정된 소수 자릿수를 사용하여 서식을 지정하는 유일한 목적을 가지고 있습니다. 문자열을 반환하는 이유는 문자열을 반환해야하기 때문이며 toStringFixed대신 이름이 지정된 경우 OP는 결과에 놀라지 않을 것입니다. 여기서 유일한 문제는 OP가 Math.roundJS 참조를 참조하지 않고 와 같이 작동 할 것으로 예상한다는 것 입니다.
Groo

177

Number.prototype.toFixed숫자 를 인쇄하기 전에 형식을 지정 하도록 설계된 기능입니다 . 그것은 가족 출신 toString, toExponential그리고toPrecision .

숫자를 반올림하려면 다음을 수행하십시오.

someNumber = 42.008;
someNumber = Math.round( someNumber * 1e2 ) / 1e2;
someNumber === 42.01;

// if you need 3 digits, replace 1e2 with 1e3 etc.
// or just copypaste this function to your code:

function toFixedNumber(num, digits, base){
  var pow = Math.pow(base||10, digits);
  return Math.round(num*pow) / pow;
}

.

당신이 "원하는 경우 또는 원시와 같은 "기능을, 당신은 프로토 타입을 확장 할 수 있습니다 :

Number.prototype.toFixedNumber = function(digits, base){
  var pow = Math.pow(base||10, digits);
  return Math.round(this*pow) / pow;
}
someNumber = 42.008;
someNumber = someNumber.toFixedNumber(2);
someNumber === 42.01;


//or even hexadecimal

someNumber = 0xAF309/256  //which is af3.09
someNumber = someNumber.toFixedNumber(1, 16);
someNumber.toString(16) === "af3.1";

그러나 모듈에는 부작용이 없어야 모듈을 작성할 때 프로토 타입을 오염시키는 것이 좋지 않은 것으로 간주됩니다. 따라서 모듈의 경우 첫 번째 함수를 사용하십시오 .


12
이것이 가장 좋은 대답이라고 생각합니다. 타입 변환을 피합니다. 굉장한 소스!
Phil

1
좋은 답변입니다! 그러나 ... 20 년 정도의 JavaScript를 해왔지만 반환 값 주위에 + (...) 구성을 사용하는 이유를 알 수 없습니까? 덕분에 마찰에 대한 @sam : 내가 배울 결코 너무 늙었으로 :-) 자세히 설명해
HammerNL

1
@HammerNL Sam의 신념에도 불구하고, 그것은 아무 것도하지 않습니다. :) 단지 연습 일뿐 type Number입니다. IDE가이 기능을 문제는 +(anyValue)항상 숫자를 반환 한다는 것입니다 . +("45")반환 45, +(new Number(42))반환 42. 그것은 함수를 강력하게 타이핑하는 것과 같습니다. 습관을 들이면 많은 버그를 피할 수 있습니다. :)
m93a

왜 이런 일이 핵심 자바 스크립트에 구운되지 않습니다들
웹 마스터

2
의 resuit이 someNumber = Math.round( 42.008 * 1e2 ) / 1e2;아니다 42.01, 그것은이다 ~42.0099999999999980. 이유 : 숫자 42.01가 존재하지 않으며 가장 가까운 기존 숫자로 반올림됩니다. btw, 증명 번호 toPrecision(18)로 모든 관련 숫자로 인쇄하십시오.
Wiimm

118

이것을 변경 하여이 문제를 해결했습니다.

someNumber = someNumber.toFixed(2)

...이에:

someNumber = +someNumber.toFixed(2);

그러나 이것은 숫자를 문자열로 변환하고 다시 구문 분석하여 성능에 큰 영향을 미칩니다. 성능이나 유형 안전에 관심이 있다면 다른 답변도 확인하십시오.


39
아냐 아냐 아냐 아냐 아냐 하지마 ! 반올림하기 위해 숫자를 문자열로 변환하는 것은 매우 나쁜 습관입니다 ! 대신해라 someNumber = Math.round(someNumber * 1e2) / 1e2! 더 일반적인 방법은 내 대답을 참조하십시오.
m93a

@ m93a-왜 그렇게 나쁜 습관입니까?
jczaplew

3
당신이 이런 식으로 할 경우, 32 비트 바이너리 번호는 모든 신 저주의 진수를 위해 16 비트를 사용하여 문자열로 변환되기 때문에 @jczaplew 자리 ! (UTF-16으로 숫자를 저장하는 것이 가장 편리한 방법은 아닙니다.) 문자열보다 32 비트 부동 소수점 숫자로 다시 변환됩니다. 숫자로 자릿수. (올바른 구문 분석 알고리즘을 선택하기 전에 수행해야 할 모든 테스트를 무시하면) 헛된 점을 고려하면 플로트에서 3 가지 빠른 작업을 사용하여 수행 할 수 있습니다.
m93a

2
@ m93a 그래서 성능상의 이유입니까? 실제로 성능에 눈에 띄는 영향이 있습니까?
Sebastianb

2
@jczaplew, 왜냐하면 문자열은 (1) 실제로 느리고 (2) 이론적으로 부정확하기 때문입니다.
Pacerier

29

왜 사용하지 parseFloat않습니까?

var someNumber = 123.456;
someNumber = parseFloat(someNumber.toFixed(2));
alert(typeof(someNumber));
//alerts number

15

JavaScript Number()함수를 사용하여 숫자로 다시 변환하여 해결했습니다.

var x = 2.2873424;
x = Number(x.toFixed(2));

12

물론 문자열을 반환합니다. 숫자 변수를 반올림하려면 Math.round ()를 대신 사용하십시오. 고정 지점 은 사용자에게 표시 할 고정 소수점 이하 자릿수 숫자를 형식화하는 것 입니다.


4

단순히 '+'를 사용하여 결과를 숫자로 변환 할 수 있습니다.

var x = 22.032423;
x = +x.toFixed(2); // x = 22.03

3

숫자를 형식화해야 할 때 반환되는 것은 무엇입니까? 숫자가있는 경우 예를 들어 2 == 2.0 == 2.00등 이 있기 때문에 아무것도 할 수 없으므로 문자열이어야합니다.


3

문자열이어야하는 이유의 예를 제공하려면 다음을 수행하십시오.

1.toFixed (2)를 포맷하면 '1.00'이됩니다.

1에는 소수점이 2 개가 없으므로 1과 같지 않습니다.


JavaScript는 성능 언어 가 아니라는 것을 알고 있지만 다음과 같은 것을 사용하면 반올림의 성능이 향상 될 가능성이 있습니다. roundedValue = Math.round (value * 100) * 0.01


2

주요 용도는 숫자를 표시하기 때문입니까? 숫자를 반올림하려면 Math.round()적절한 요소를 사용하십시오.


NUMBERS를 표시하므로 "숫자"를 반환해서는 안됩니까?
Derek Adair

3
@ 데릭 : '42'숫자 방식으로 만 ... 그렇지 않습니다. 문자열에 숫자가 포함되어 있기 때문에 숫자 만 만들지는 않습니다. 이것은 PHP가 아닙니다. :-P
Chris Jester-Young

lol. 숫자가 포함 된 문자열이 아닙니다 ... 메소드에 전달되는 숫자입니다. 이 메서드는 숫자를 받아서 문자열을 반환합니다.
Derek Adair

@DerekAdair는 맞지만 브라우저는 숫자를 표시 할 수 없으며 문자열을 표시하므로 변환됩니다.
Nick M

1

m93a제공 되는 답변의 기능 버전이 약간 더 있습니다 .

const toFixedNumber = (toFixTo = 2, base = 10) => num => {
  const pow = Math.pow(base, toFixTo)
  return +(Math.round(num * pow) / pow)
}

const oneNumber = 10.12323223

const result1 = toFixedNumber(2)(oneNumber) // 10.12
const result2 = toFixedNumber(3)(oneNumber) // 10.123

// or using pipeline-operator
const result3 = oneNumber |> toFixedNumber(2) // 10.12

편리한 함수이며 정의되지 않은 유형의 경우 작동하지 않습니다.이 경우 코드를 추가했습니다. if (num! == undefined) {return + (Math.round (num * pow) / pow)} else {return 0; }
Dino Liu
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.