JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptで数値をドル通貨文字列としてフォーマットする方法

JavaScriptで数値をドル通貨(US$)形式の文字列としてフォーマットするには、Intl.NumberFormatオブジェクトを使用します。これはECMAScript国際化API(Internationalization API)の一部であり、主要なブラウザやNode.jsで標準的にサポートされています。

基本的な使い方

Intl.NumberFormatのコンストラクタにロケール(例:'en-US')とオプションを指定することで、通貨記号付きの文字列を簡単に生成できます。主なオプションは以下の通りです。

  • style:'currency' を指定すると通貨フォーマットになります
  • currency:ISO 4217通貨コード(米ドルなら 'USD')を指定します
  • minimumFractionDigits:小数点以下の最小桁数を指定します

サンプルコード

次のコードは、数値150を米ドル表記の文字列としてフォーマットして表示する例です。

<!DOCTYPE html>
<html>
   <body>
      <p>
         150を米ドル(US$)としてフォーマット:
      </p>
      <script>
         var formatter = new Intl.NumberFormat('en-US', {
            style: 'currency',
            currency: 'USD',
            minimumFractionDigits: 2,
         });
         // 150ドルを表示
         document.write(formatter.format(150));
      </script>
   </body>
</html>

実行結果

このコードを実行すると、次のように出力されます。

$150.00

補足:toLocaleStringメソッドを使う方法

より簡潔に書きたい場合は、NumberオブジェクトのtoLocaleString()メソッドでも同様の結果が得られます。

var result = (150).toLocaleString('en-US', {
  style: 'currency',
  currency: 'USD'
});
console.log(result); // $150.00

Intl.NumberFormatは、一度作成したフォーマッターを再利用できるため、大量のデータを処理する場合にも効率的です。また、日本円(JPY)やユーロ(EUR)など他の通貨にも対応しており、ロケールと通貨コードを変更するだけで多言語・多通貨対応が簡単に実現できます。

  1. JavaScriptで小数を検証するには?正規表現を使った実装例を解説

    JavaScriptで小数を検証する方法 JavaScriptで、ユーザーが入力した値が正しい小数(小数点を含む数値)かどうかを判定したい場面はよくあります。そんなときに便利なのが正規表現です。本記事では、match()メソッドと正規表現を組み合わせて、入力値が小数かどうかを検証する方法を、具体的なコード例とともにわかりやすく解説します。 使用する正規表現パターン 今回の検証では、以下の正規表現を使用します。 /^[-+]?[0-9]+\.[0-9]+$/ このパターンの各要素の意味は次のとおりです。 ^[-+]?:文字列の先頭に符号(+ または -)が付いていても、付いていなくてもマッチ

  2. JavaScriptオブジェクトの内容を文字列として表示する方法

    JavaScriptでオブジェクトの内容を文字列形式で画面に表示したい場合、document.getElementById()でHTML要素を取得し、innerHTMLを使って書き出すのが基本的な方法です。オブジェクトを文字列に変換するには、JSON.stringify()メソッドを活用します。 実装手順 まず、表示先となるHTML要素にIDを設定します。次に、JavaScript側でそのIDを指定して要素を取得し、変換した文字列をinnerHTMLに代入します。 コード例 <!DOCTYPE html> <html lang="ja"> <h