数値を桁区切りで表示する(数値のカンマ区切り)|JavaScript

2017.01.07 2021.10.09

JavaScriptで数値を桁区切り(３桁毎のカンマ区切り)の文字列として出力する方法です。
ここでは数値を文字列に変換後、正規表現にマッチしたものを置換しています。

書式

"12345678".replace(/()(?=()+(?!))/g, '$1,');

数値のみしかないのであれば、下記でもOK。

"12345678".replace(/()(?=()+$)/g, '$1,');

実行結果

12,345,678

メモ

$1は後方参照といい、マッチ結果が入る。
$1は文字列であること。"$1" + ","などの記述でもOK。
gはグローバルマッチの意味。

正規表現	内容
a(?=b)	先読み。条件aに条件bが続く場合のみaにマッチする。結果はaのマッチのみ。
a(?!b)	否定先読み。条件aに条件bが続かない場合のみaにマッチする。結果はaのマッチのみ。

実行サンプル

<html>
<head>
<title>数値のカンマ区切り</title>
</head>
<body>
<script type="text/javascript">
  var text = "1234567890".replace(/(\d)(?=(\d\d\d)+$)/g, "$1,");
  document.write(text);

  document.write("<br />");

  var num = 123.01;
  text = num.toString().replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,");
  document.write(text);

  // 上記は123.0が123になってしまう

  document.write("<br />");

  var num2 = 123.00;
  var float_text = String(Math.ceil(num2)) + String(num2 + 0.00000001).substr(-9).substring(0, 3);
  text = String(float_text).replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,");
  document.write(text);
</script>
</body>
</html>

実行結果

1,234,567,890
123.01
123.00

コメントコメントをキャンセル

次の記事

JavaScript

JSTL覚え書き/Coreタグライブラリ