web-dev-qa-db-ja.com

JavaScriptで数値をフォーマットするための正規表現

JavaScriptを使用して、Webページにフォーマット済みの数値を表示する必要があります。適切な場所にコンマがあるようにフォーマットしたい。正規表現でこれを行うにはどうすればよいですか？私は次のようなものを得ました：

myString = myString.replace(/^(\d{3})*$/g, "${1},");

...そして、これは私が考えるよりも複雑になることを認識しました（そして上の正規表現は近くさえない必要なものです）。私はいくつかの検索を行いましたが、これに役立つものを見つけるのに苦労しています。

基本的に、私はこれらの結果が欲しい：

  • 45は45になります
  • 3856は3,856になります
  • 398868483992は398,868,483,992になります

...あなたはアイデアを得る。

javascriptregexformatting
40
Brandon Montgomery

これは単一の正規表現で行うことができ、反復は不要です。ブラウザーがECMAScript 2018をサポートしている場合は、単にlookaroundを使用して、適切な場所にカンマを挿入するだけで済みます。

(?<=\d)(?=(\d\d\d)+(?!\d))を検索し、すべてを,に置き換えます

古いバージョンでは、JavaScriptは後読みをサポートしていないため、機能しません。幸いなことに、少し変更するだけで済みます。

(\d)(?=(\d\d\d)+(?!\d))を検索し、すべてを\1,に置き換えます

したがって、JavaScriptでは、次のようになります。

result = subject.replace(/(\d)(?=(\d\d\d)+(?!\d))/g, "$1,");

説明：ストリング内の現在位置以降で、3の倍数で数字を一致させることが可能であり、現在位置の左に数字があることをアサートします。

これは、「ドットの右側」の桁数が多すぎない限り、小数（123456.78）でも機能します（そうでなければ、123,456.789,012を取得します）。

次のように、Numberプロトタイプで定義することもできます。

Number.prototype.format = function(){
   return this.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,");
};

そして、次のように使用します：

var num = 1234;
alert(num.format());

クレジット：Jeffrey Friedl、 Mastering Regular Expressions、3rd。edition 、p。 66-67

110
Tim Pietzcker

1行のコードで数値の書式設定をエレガントに処理できます。

このコードはNumberオブジェクトを拡張します。以下に使用例を示します。

コード：

_Number.prototype.format = function () {
    return this.toString().split( /(?=(?:\d{3})+(?:\.|$))/g ).join( "," );
};
_

仕組み

正規表現は、先読みを使用して、10進数または文字列の終わりが検出されるまで、文字列内の右側にあるものが3つの数字の1つ以上のグループである位置を検索します。 .split()は、これらのポイントで文字列を配列要素に分割するために使用され、.join()はそれらの要素をコンマで区切られた文字列にマージします。

実際の文字に一致するのではなく、文字列内でpositionsを見つけるという概念は、文字を削除せずに文字列を分割するために重要です。

使用例：

_var n = 9817236578964235;
alert( n.format() );    // Displays "9,817,236,578,964,235"

n = 87345.87;
alert( n.format() );    // Displays "87,345.87"
_

もちろん、ロケールの考慮事項を処理するために、コードを簡単に拡張または変更できます。たとえば、ロケール設定を自動的に検出し、カンマとピリオドの使用を交換する新しいバージョンのコードは次のとおりです。

ロケール対応バージョン：

_Number.prototype.format = function () {

    if ((1.1).toLocaleString().indexOf(".") >= 0) {
        return this.toString().split( /(?=(?:\d{3})+(?:\.|$))/g ).join( "," );
    }
    else {
        return this.toString().split( /(?=(?:\d{3})+(?:,|$))/g ).join( "." );
    }
};
_

本当に必要でない限り、私は最初のバージョンのシンプルさを好みます。

17
Speednet

//小数を考慮したい場合があります

Number.prototype.commas= function(){
 var s= '', temp, 
 num= this.toString().split('.'), n=num[0];
 while(n.length> 3){
  temp= n.substring(n.length-3);
  s= ','+temp+s;
  n= n.slice(0, -3);
 }
 if(n) s= n+s;
 if(num[1]) s+='.'+num[1];
 return s;
}

var n = 10000000000.34;

n.commas（）=戻り値：（文字列）10,000,000,000.34

4
kennebec

本当に正規表現が必要な場合は、whileループで2つ使用できます。

while(num.match(/\d{4}/)) {
    num = num.replace(/(\d{3})(,\d|$)/, ',$1$2');
}

また、空想になりたい場合は、数値を小数点でフォーマットすることもできます。

while(num.match(/\d{4}(\,|\.)/)) {
    num = num.replace(/(\d{3})(,\d|$|\.)/, ',$1$2');
}

編集：

また、2つの正規表現を使用して、ループ、分割、結合などを使用せずにこれを行うこともできます。

num = num.replace(/(\d{1,2}?)((\d{3})+)$/, "$1,$2");
num = num.replace(/(\d{3})(?=\d)/g, "$1,");

最初の正規表現は、残りの桁数が3で割り切れる場合、最初の1桁または2桁の後にコンマを置きます。 2番目の正規表現は、残りの3桁のグループごとにカンマを配置します。

これらは小数では機能しませんが、正および負の整数ではうまく機能します。

テスト出力：

45
3,856
398,868,483,992

635
12,358,717,859,918,856
-1,388,488,184
2
Jeff B

誰かが、Javascript RegExpでは後読みができないと述べました。ルックアラウンド（lookaheadとlookbehind）の使用方法を説明する素晴らしいページがあります。

http://www.regular-expressions.info/lookaround.html

1
Robusto

nderscore.string には ニースの実装 があります。

数値文字列を受け入れるように少し修正しました。

function numberFormat (number, dec, dsep, tsep) {
  if (isNaN(number) || number == null) return '';

  number = parseFloat(number).toFixed(~~dec);
  tsep = typeof tsep == 'string' ? tsep : ',';

  var parts = number.split('.'), fnums = parts[0],
    decimals = parts[1] ? (dsep || '.') + parts[1] : '';

  return fnums.replace(/(\d)(?=(?:\d{3})+$)/g, '$1' + tsep) + decimals;
},
1
mpen

繰り返しは必要ありません

function formatNumber(n, separator) {
    separator = separator || ",";

    n = n.toString()
        .split("").reverse().join("")
        .replace(/(\d{3})/g, "$1" + separator)
        .split("").reverse().join("");

    // Strings that have a length that is a multiple of 3 will have a leading separator
    return n[0] == separator ? n.substr(1) : n;
}

var testCases = [1, 45, 2856, 398868483992];
for ( var i in testCases ) {
    if ( !ns.hasOwnProperty(i) ) { continue; }
    console.info(testCases[i]);   
    console.log(formatNumber(testCases[i]));
}

結果

1
1

45
45

2856
2,856

398868483992
398,868,483,992
0
Justin Johnson

ブランドン、

正規表現を小数点から戻すのにあまり多くの答えが見られなかったので、私は中に入れるかもしれないと思った。

後方からスキャンするために正規表現を書き直すことには、エレガントな利点があるのだろうか...

function addCommas(inputText) {
    // pattern works from right to left
    var commaPattern = /(\d+)(\d{3})(\.\d*)*$/;
    var callback = function (match, p1, p2, p3) {
        return p1.replace(commaPattern, callback) + ',' + p2 + (p3 || '');
    };
    return inputText.replace(commaPattern, callback);
}

>> Fiddle Demo <<

これは、小数点以下を表します。

0
Levi Beckman

次のようなものを試してください：

function add_commas(numStr)
{
    numStr += '';
    var x = numStr.split('.');
    var x1 = x[0];
    var x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
        x1 = x1.replace(rgx, '$1' + ',' + '$2');
    }
    return x1 + x2;
}
0
Seth

正規表現でこれを実現するには、必ず複数のパスを実行する必要があると思います。以下を試してください：

  1. 1桁の後に3桁の正規表現を実行します。
  2. その正規表現が一致する場合、最初の数字、コンマ、次の3桁の順に置き換えます。
  3. （1）が一致するものを見つけるまで繰り返します。
0
Ryan Brunner

最初に文字配列を反転し、文字列の終わりの直前または-記号の前でない限り、3番目ごとにカンマを追加します。次に、文字配列を再び逆にして、再び文字列にします。

function add_commas(numStr){
    return numStr.split('').reverse().join('').replace(/(\d{3})(?=[^$|^-])/g, "$1,").split('').reverse().join('');
}
0
Harmen