資料結構
網路
關係型資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法律研究如何在 JavaScript 中將數字格式化為美元貨幣字串？
本教程將教你如何在 JavaScript 中將數字格式化為美元貨幣字串。現在，問題來了，為什麼我們需要將數字格式化為美元貨幣字串？答案在這裡。使用者可以考慮這樣的場景：他們正在開發一個電子商務網站或應用程式，並且必須向客戶顯示產品價格。如果他們將產品價格顯示為2500和$2500會怎麼樣？第二個看起來更好，因為‘$’代表USD貨幣，是顯示USD貨幣的標準化方式。此外，第二種方法更容易理解。
下面，我們提供瞭解決上述問題並將數字顯示為 USD 貨幣字串的不同方法。
- 使用字串連線
- 使用Intl.NumberFormat()方法
- 使用toLocaleString()方法
使用字串連線
在這種方法中，我們將簡單地使用 JavaScript 中的‘+’符號進行字串連線。這是將數字表示為美元貨幣字串最簡單的方法。
語法
let price = 1642; var currencyUSD = ‘$’ + price;
示例 1
下面的示例演示了使用者如何使用 JavaScript 中的字串連線在數字前新增 ‘$’ 符號。
<!DOCTYPE html>
<html>
<body>
<h2>Format Numbers as a dollar currency string</h2>
<p> Formatting 1642 as US dollars (US$):</p>
<p id="result"> </p>
<script type="text/javascript">
// function to format number with $ sign.
function formatNumberWithDollar() {
let price = 1642;
let formattedPrice = '$' + price;
var result = document.getElementById("result");
result.innerHTML = formattedPrice ;
}
formatNumberWithDollar();
</script>
</body>
</html>在上面的輸出中，使用者可以看到我們的價格是如何用美元貨幣符號字串格式化的。
使用Intl.NumberFormat()方法
在 JavaScript 中，將數字格式化為貨幣字串的最佳方法之一是使用Intl.NumberFormat()方法。您可以將區域設定作為引數傳遞給該方法，並在數字前設定美元符號並格式化數字。
你們中有些人第一次聽說區域設定這個詞。它不是 JavaScript 中的任何方法，但它根據本地區域提供了一組引數。簡單來說，它指定了區域編號格式、日期和時間格式、貨幣格式、星期幾格式等。
語法
let formatting_options = {
style: 'currency',
currency: 'USD',
minimumFractionDigits: 3,
}
let dollarString = new Intl.NumberFormat( locale_string, formatting_options );引數
locale_string − 它應該根據您想要獲取本地引數的區域進行傳遞。例如，要獲取美國的本地引數，您將傳遞 ‘en-US’，對於印度，您將傳遞 ‘en-IN’。
formatting_options − 它是一個包含許多用於格式化數字字串的屬性的物件。主要的是，下面的三個選項屬性更有價值。
style − 它是數字格式化字串的基本樣式。它採用三個不同的值，例如“currency”、“decimal”和“percentage”。在本例中，我們將使用“currency”。
currency − 此引數指定貨幣符號，例如美元的“USD”。
minimumFractionDigits − 使用此引數，我們可以四捨五入小數點後的數字位數。
示例 2
下面的示例演示了 Intl.NumberFormatting() 方法的使用。
<!DOCTYPE html>
<html >
<head>
<body>
<h2> The Intl.NumberFormat() method</h2>
<p> Formatting 5323.35445 as US dollars (US$):</p>
<p id="result"></p>
<p> We set minimumFractionDigits to 3.</p>
<script type="text/javascript">
// function to format number with Intl.NumberFormat() method.
function formatNumberWithDollar() {
let formatting_options = {
style: 'currency',
currency: 'USD',
minimumFractionDigits: 3,
}
// users can see how locale passed as a parameter.
let dollarString = new Intl.NumberFormat("en-US", formatting_options);
let finalString = dollarString.format(5323.35445);
var result = document.getElementById("result");
result.innerHTML = finalString;
}
formatNumberWithDollar();
</script>
</body>
</html>在上面的輸出中，使用者可以看到數字被四捨五入到 3 位，並以帶有美元符號的字串形式表示。
使用toLocaleString()方法
toLocaleString()也是 JavaScript 中的內建方法，與 Intl.numberFormat() 方法類似。它採用與 Intl.numberFormat 方法相同的引數，並將字串轉換為特定於區域的字串。
語法
let formatting_options = {
style: ‘currency’,
currency: ‘USD’,
minimumFractionDigits: 3,
}
let dollarString = toLocaleString( locale_string, formatting_options );引數
它採用與Intl.numberFormat()方法相同的引數。使用者可以參考上述方法。
示例 3
下面的示例演示了使用toLocaleString()方法用美元符號格式化數字。
<!DOCTYPE html>
<html >
<head>
<body>
<h2> The toLocaleString() method</h2>
<p> Formatting 2434454.6554 as US dollars (US$):</p>
<p id="result"></p>
<script type="text/javascript">
let formatting_options = {
style: 'currency',
currency: 'USD',
minimumFractionDigits: 3,
}
let price = 2434454.6554;
let numberWithDollar = price.toLocaleString("en-US",
formatting_options);
var result = document.getElementById("result");
result.innerHTML = numberWithDollar;
</script>
</body>
</html>上述方法給出的輸出與Intl.numberFormat()方法相同。在上述結果中，使用者可以看到數字是用美元符號格式化的，並且小數點後四捨五入到 3 位。
結論
本教程介紹了三種不同的方法來使用美元字串格式化數字。解決我們問題的最佳和標準方法是第二種方法。使用Intl.numberFormat()方法，您可以將所有字串、數字和引數轉換為區域敏感的字串。
15K+ 次檢視
