Jak mogę zaokrąglić liczbę w JavaScript?


228

Jak mogę zaokrąglić liczbę w JavaScript?

math.round() nie działa, ponieważ zaokrągla go do najbliższego miejsca po przecinku.

Nie jestem pewien, czy jest lepszy sposób na zrobienie tego niż zerwanie go w przecinku dziesiętnym przy zachowaniu pierwszego bitu. Musi być...


21
Zaokrąglić w kierunku zera czy w kierunku ujemnej nieskończoności?
Daniel Brückner,

Odpowiedzi:



60

Zaokrąglaj w kierunku ujemnej nieskończoności - Math.floor()

+3.5 => +3.0
-3.5 => -4.0

Zaokrąglanie w kierunku zera - zwykle nazywane Truncate(), ale nie obsługiwane przez JavaScript - może być emulowane za pomocą Math.ceil()liczb ujemnych i Math.floor()liczb dodatnich.

+3.5 => +3.0 using Math.floor()
-3.5 => -3.0 using Math.ceil()

Dziękuję za kompletność, ale wielkie litery są niepoprawne ... i w skrypcie java robi to OGROMNĄ różnicę. W przeciwnym razie głosowałbym tutaj.
George,

Zaktualizowałem odpowiedź, aby wielkie litery były teraz poprawne.
chasen

18
@ George OGROMNY czy ogromny? : D
m93a

1
Możesz uzyskać taki sam efekt jak zaokrąglanie do zera przez x | 0.
Ahmed Fasih

28

Math.floor()będzie działać, ale jest bardzo powolny w porównaniu do ORoperacji bitowej :

var rounded = 34.923 | 0;
alert( rounded );
//alerts "34"

EDYCJA nieMath.floor() jest wolniejsza niż przy użyciu | operator. Dzięki Jasonowi S za sprawdzenie mojej pracy.

Oto kod, którego użyłem do testowania:

var a = [];
var time = new Date().getTime();
for( i = 0; i < 100000; i++ ) {
    //a.push( Math.random() * 100000  | 0 );
    a.push( Math.floor( Math.random() * 100000 ) );
}
var elapsed = new Date().getTime() - time;
alert( "elapsed time: " + elapsed );

11
??? Właśnie uruchomiłem jsdb (www.jsdb.org), który używa Spidermonkey 1.7, i uruchomiłem pętlę, aby zsumować dolną wartość x [i] na tablicy 100000 liczb zmiennoprzecinkowych, najpierw za pomocą Math.floor (), następnie z bitową lub jak sugerujesz. Zajęło to mniej więcej tyle samo czasu, 125 ms.
Jason S

4
Właśnie powtórzyłem test z liczbami zmiennoprzecinkowymi 500000, zajęło to mniej więcej tyle samo czasu, około 625 ms.
Jason S

5
Więc nie rozumiem, jak 1.25usec jest bardzo wolny.
Jason S

3
Nie mogę się kłócić z twoimi danymi :) Myślę, że mogłem pomylić implementację JS z ActionScript (zbudowaną na EcmaScript; oczywiście implementacja jest inna). Dzięki za sprawdzenie mojej pracy!
geraldalewis

14
Nie robią tego samego. |konwertuje na 32-bitową liczbę całkowitą, obcinając; Math.floorzaokrągla w dół. jsfiddle.net/minitech/UVG2w
Ry-

21

Możesz spróbować użyć tej funkcji, jeśli chcesz zaokrąglić w dół do określonej liczby miejsc po przecinku

function roundDown(number, decimals) {
    decimals = decimals || 0;
    return ( Math.floor( number * Math.pow(10, decimals) ) / Math.pow(10, decimals) );
}

przykłady

alert(roundDown(999.999999)); // 999
alert(roundDown(999.999999, 3)); // 999.999
alert(roundDown(999.999999, -1)); // 990

Myślę, że taki jednowierszowy nie wymaga żadnej funkcji.
Hubert Grzeskowiak

4
roundDown (4.56, 2) daje ci 4.55, więc nie sądzę, że to dobre rozwiązanie.
cryss

6

Aby zaokrąglić w dół w kierunku ujemnej nieskończoności, użyj:

rounded=Math.floor(number);

Aby zaokrąglić w dół do zera (jeśli liczba może zaokrąglić do 32-bitowej liczby całkowitej od -2147483648 do 2147483647), użyj:

rounded=number|0;

Aby zaokrąglić w dół do zera (dla dowolnej liczby), użyj:

if(number>0)rounded=Math.floor(number);else rounded=Math.ceil(number);

5

Zaokrąglanie w numberkierunku 0można wykonać, odejmując podpisaną część ułamkową number % 1:

rounded = number - number % 1;

Podobnie jak Math.floor(zaokrągla w kierunku -Infinity) ta metoda jest całkowicie dokładna.

Istnieją różnice w obsłudze -0, +Infinitya -Infinityjednak:

Math.floor(-0) => -0
-0 - -0 % 1    => +0

Math.floor(Infinity)    => Infinity
Infinity - Infinity % 1 => NaN

Math.floor(-Infinity)     => -Infinity
-Infinity - -Infinity % 1 => NaN

3
Math.floor(1+7/8)

1 + 7/8 = 1 - Nie ma potrzeby używania Math.floor () tam :)
Jason Berry

18
Właściwie to (7/8) +1, co nie jest 1. Dziękuję algebrze 3. klasy
Joe Phillips

1
Umm, proszę, spróbuj tego w programie javascript. Zrobiłem. Wyświetl (1 + 7/8), a zobaczysz 1,875. Math.round (...) to 2, Math.floor (...) to 1. O czym rozmawiacie?
DigitalRoss,

1
Lub otwórz konsolę błędów Firefox. Lub Firebug. Nie jest trudno spróbować. Próbowałem tego. 1 + 7/8 to 1,875 w js. Czy prawdopodobnie zapomniałeś, że cała matematyka w js jest zmiennoprzecinkowa?
DigitalRoss

3
Prawdopodobnie łatwo zapomnieć, że javascript robi wszystko w liczbach zmiennoprzecinkowych. W wielu innych językach 1 + 7/8 to 1, ale w js to naprawdę 1,875.
DigitalRoss,

3

Bawiąc się dzisiaj z kimś innym, odkrył, co również wydaje się zaokrąglać w dół:

var dec = 12.3453465,
int = dec >> 0; // returns 12

Aby uzyskać więcej informacji na temat przesunięcia w prawo propagacji znaków (>>), zobacz Operatory bitowe MDN

Zajęło mi trochę czasu, aby zrozumieć, co to robi: D

Ale jak podkreślono powyżej, Math.floor () działa i moim zdaniem wygląda bardziej czytelnie.


3
Cicho zabija twój numer, jeśli nie mieści się w 32 bitach. Konsola chromowa: 99999999999999999999999 | 0 => -167772160
Matthias Urlichs,

0

Musisz umieścić -1, aby zaokrąglić do połowy, a następnie pomnożyć przez -1, tak jak w przykładzie poniżej.

<script type="text/javascript">

  function roundNumber(number, precision, isDown) {
    var factor = Math.pow(10, precision);
    var tempNumber = number * factor;
    var roundedTempNumber = 0;
    if (isDown) {
      tempNumber = -tempNumber;
      roundedTempNumber = Math.round(tempNumber) * -1;
    } else {
      roundedTempNumber = Math.round(tempNumber);
    }
    return roundedTempNumber / factor;
  }
</script>

<div class="col-sm-12">
  <p>Round number 1.25 down: <script>document.write(roundNumber(1.25, 1, true));</script>
  </p>
  <p>Round number 1.25 up: <script>document.write(roundNumber(1.25, 1, false));</script></p>
</div>

Szczerze mówiąc W tej społeczności preferujemy odpowiedzi takie jak @ phoebus podane powyżej.
Ankit Pandey,

0

Oto prosty przykład math.floor. Może to pomóc nowemu deweloperowi dowiedzieć się, jak używać go w funkcji i co robi. Mam nadzieję, że to pomoże!

<script>

var marks = 0;

function getRandomNumbers(){    //  generate a random number between 1 & 10
    var number = Math.floor((Math.random() * 10) + 1);
    return number;
}

function getNew(){  
/*  
    This function can create a new problem by generating two random numbers. When the page is loading as the first time, this function is executed with the onload event and the onclick event of "new" button.
*/
document.getElementById("ans").focus();
var num1 = getRandomNumbers();
var num2 = getRandomNumbers();
document.getElementById("num1").value = num1;
document.getElementById("num2").value = num2;

document.getElementById("ans").value ="";
document.getElementById("resultBox").style.backgroundColor = "maroon"
document.getElementById("resultBox").innerHTML = "***"

}

function checkAns(){
/*
    After entering the answer, the entered answer will be compared with the correct answer. 
        If the answer is correct, the text of the result box should be "Correct" with a green background and 10 marks should be added to the total marks.
        If the answer is incorrect, the text of the result box should be "Incorrect" with a red background and 3 marks should be deducted from the total.
        The updated total marks should be always displayed at the total marks box.
*/

var num1 = eval(document.getElementById("num1").value);
var num2 = eval(document.getElementById("num2").value);
var answer = eval(document.getElementById("ans").value);

if(answer==(num1+num2)){
    marks = marks + 10;
    document.getElementById("resultBox").innerHTML = "Correct";
    document.getElementById("resultBox").style.backgroundColor = "green";
    document.getElementById("totalMarks").innerHTML= "Total marks : " + marks;

}

else{
    marks = marks - 3;
    document.getElementById("resultBox").innerHTML = "Wrong";
    document.getElementById("resultBox").style.backgroundColor = "red";
    document.getElementById("totalMarks").innerHTML = "Total Marks: " + marks ;
}




}

</script>
</head>

<body onLoad="getNew()">
    <div class="container">
        <h1>Let's add numbers</h1>
        <div class="sum">
            <input id="num1" type="text" readonly> + <input id="num2" type="text" readonly>
        </div>
        <h2>Enter the answer below and click 'Check'</h2>
        <div class="answer">
            <input id="ans" type="text" value="">
        </div>
        <input id="btnchk" onClick="checkAns()" type="button" value="Check" >
        <div id="resultBox">***</div>
        <input id="btnnew" onClick="getNew()" type="button" value="New">
        <div id="totalMarks">Total marks : 0</div>  
    </div>
</body>
</html>
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.