HOWTO · JavaScript

在 JavaScript 中將數字四捨五入到小數點後兩位

本教程講解如何在 JavaScript 中將數字四捨五入至最多 2 位小數?

本頁內容

需要固定顯示小數點後兩位時,請使用 toFixed(2)。它會回傳字串,因此末尾的零會保留下來。若需要數值結果,可使用 Math.round(value * 100) / 100,或用 Number() 將格式化後的字串轉回數字。這些方法適合一般數值,但 JavaScript 使用二進位浮點數儲存數字,因此像 1.005 這類十進位輸入,結果可能與讀者預期不同。

使用 toFixed() 格式化數字

對數字呼叫 toFixed(2),會取得小數點後有兩位數字的字串。當標籤、表格儲存格或其他顯示內容需要保留 5.60 末尾的零時,這種方式很實用。不過,回傳值是文字;若要用它進行算術運算,必須先轉回數字。

執行以下範例:

本節中的程式碼以及顯示的標籤或輸出仍為英文。

const value = 5.6789;
const fixedText = value.toFixed(2);
const roundedValue = Math.round(value * 100) / 100;
const numericValue = Number(value.toFixed(2));

function roundToTwo(number) {
  const shifted = Number(`${number}e2`);
  return Number(`${Math.round(shifted)}e-2`);
}

const shiftedValue = roundToTwo(value);
console.log(fixedText, roundedValue, numericValue, shiftedValue);
5.68 5.68 5.68 5.68

依序來看,這些值分別是 toFixed() 回傳的字串、Math.round() 回傳的數字、經 Number() 轉換的結果,以及十進位位移輔助函式的結果。只有第一個值是文字;用 Number() 轉換後會得到數字,也不會保留末尾的零。

使用 Math.round() 將數字四捨五入

將數字乘以 100,會把百分位移到個位數的位置。Math.round() 會將縮放後的值四捨五入成整數,再除以 100 還原小數位數。結果仍是數字,方便後續運算,但不會記錄要顯示幾位小數。

Math.round() 會將剛好位於中間的值往正無限大的方向取整。例如,-1.5 會取整為 -1,因此負數並非一律採用遠離零的方向取整。此外,乘法本身也使用浮點數運算;這種寫法簡潔,但不能保證所有輸入都能精確地按十進位規則取整。

了解浮點數的邊界情況

JavaScript 的 Number 型別使用二進位浮點數表示數值。許多十進位小數無法以二進位精確表示,中間運算的結果也可能略低於或略高於人們原本想表示的十進位值。常見的例子是 1.005:它儲存的值略低於該十進位小數,因此 1.005.toFixed(2) 可能產生 "1.00";先縮放再使用 Math.round(),結果也可能出乎預期。

Number.EPSILON 是 1 與下一個可表示數字之間的間距。在取整前加上它,對接近 1 的某些輸入可能有幫助,但可表示數字之間的間距會隨數值大小改變。因此,固定的 epsilon 調整無法修正所有數值或所有運算過程造成的誤差。

toPrecision() 控制的是有效位數,而不是小數點後的位數。例如,Number((1.23456).toPrecision(4)).toFixed(2) 會產生 "1.24",而 (1.23456).toFixed(2) 會產生 "1.23":第一個操作會先將數字取整為 1.235,第二個操作又將這個中間值取整一次。這是特定的雙重取整情況,不能當作通用修正方法;第一次格式化可能會捨棄後續步驟需要的資訊。

使用十進位位移輔助函式

上方的輔助函式使用指數表示法移動十進位尺度、將位移後的值取整,再移回原尺度。這能避開直接將十進位小數乘以 100 所造成的部分意外,同時仍回傳數字。若要取整到其他位數,可調整指數:向前位移時使用該位數,移回時則使用其負值。

這個輔助函式適合處理一般有限數值,但它不是十進位算術函式庫。浮點數表示方式的影響仍然存在;極大或極小的數值,以及特殊值,可能需要另外處理。如果金錢或會計計算需要精確的十進位行為,可在適用的情況下改用整數表示最小貨幣單位,或選用依應用需求設定規則的十進位算術函式庫。格式化顯示結果與執行精確的十進位計算,是兩種不同的需求。

選擇合適的方法

若要固定寬度的顯示文字,請使用 toFixed(2);它會保留末尾的零並回傳字串。若需要簡潔的數值結果,且輸入範圍適合一般浮點數運算,可使用 Math.round(value * 100) / 100。若想先採用 toFixed() 的取整方式,再取得數值,可使用 Number(value.toFixed(2));但請留意,數值不會保留顯示格式。了解限制後,也可考慮使用十進位位移輔助函式取得數值。

這些方法都無法讓 JavaScript 數字成為精確的十進位數值。在介面中,請在需要顯示時再格式化數字。若計算必須遵守嚴格的十進位規則,請明確定義取整政策與數值表示方式,並用應用情境中的代表性數值進行測試。