私は、桁区切り記号としてカンマを使用して整数をJavaScriptで出力しようとしています。たとえば、数値1234567を "1,234,567"として表示したいとします。これを行うにはどうすればよいですか？

ここに私がそれをやっている方法があります：

function numberWithCommas(x) {
    x = x.toString();
    var pattern = /(-?\d+)(\d{3})/;
    while (pattern.test(x))
        x = x.replace(pattern, "$1,$2");
    return x;
}

それを行うためのより簡単またはよりエレガントな方法はありますか？フロートでも機能するのは良いことですが、それは必須ではありません。ピリオドとコンマの間を決定するために、ロケール固有である必要はありません。

私はケリーの答えからのアイデアを使用しましたが、私が特定の目的のために単純な何かを探していたのでそれを単純化しました。これが私がしたことです：

function numberWithCommas(x) {
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}

function numberWithCommas(x) {
    return x.toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
}

function test(x, expect) {
    const result = numberWithCommas(x);
    const pass = result === expect;
    console.log(`${pass ? "✓" : "ERROR ====>"} ${x} => ${result}`);
    return pass;
}

let failures = 0;
failures += !test(0,        "0");
failures += !test(100,      "100");
failures += !test(1000,     "1,000");
failures += !test(10000,    "10,000");
failures += !test(100000,   "100,000");
failures += !test(1000000,  "1,000,000");
failures += !test(10000000, "10,000,000");
if (failures) {
    console.log(`${failures} test(s) failed`);
} else {
    console.log("All tests passed");
}

.as-console-wrapper {
    max-height: 100% !important;
}

正規表現は2つの先読みアサーションを使用します。

• 連続する3桁の倍数を持つ文字列内の任意のポイントを検索するための正の値、
• そのポイントが正確に3桁の倍数のみを持っていることを確認する否定のアサーション。置換式はそこにコンマを置きます。

たとえば、これを渡すと123456789.01、肯定的なアサーションは7の左側のすべてのスポットに一致します（7893桁678の倍数、3桁の倍数567などです）。否定のアサーションは、3桁の倍数の後に数字がないことを確認します。789後にピリオドがあるため、正確に3桁の倍数であるため、コンマがそこに移動します。678は3桁の倍数ですが、9後に数字があるため、これらの3桁は4のグループの一部であり、コンマはそこに行きません。同様に567。4567896桁で3の倍数なので、その前にコンマが付きます。345678は3の倍数ですが、9後にはあるため、コンマは入りません。等々。の\B 正規表現が文字列の先頭にコンマを置かないようにします。

@ neu-rahは、この関数は小数点の後に3桁以上ある場合、望ましくない場所にカンマを追加すると述べました。これが問題である場合は、次の関数を使用できます。

function numberWithCommas(x) {
    var parts = x.toString().split(".");
    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    return parts.join(".");
}

function numberWithCommas(x) {
    var parts = x.toString().split(".");
    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    return parts.join(".");
}

function test(x, expect) {
    const result = numberWithCommas(x);
    const pass = result === expect;
    console.log(`${pass ? "✓" : "ERROR ====>"} ${x} => ${result}`);
    return pass;
}

let failures = 0;
failures += !test(0              , "0");
failures += !test(0.123456       , "0.123456");
failures += !test(100            , "100");
failures += !test(100.123456     , "100.123456");
failures += !test(1000           , "1,000");
failures += !test(1000.123456    , "1,000.123456");
failures += !test(10000          , "10,000");
failures += !test(10000.123456   , "10,000.123456");
failures += !test(100000         , "100,000");
failures += !test(100000.123456  , "100,000.123456");
failures += !test(1000000        , "1,000,000");
failures += !test(1000000.123456 , "1,000,000.123456");
failures += !test(10000000       , "10,000,000");
failures += !test(10000000.123456, "10,000,000.123456");
if (failures) {
    console.log(`${failures} test(s) failed`);
} else {
    console.log("All tests passed");
}

.as-console-wrapper {
    max-height: 100% !important;
}

@ tjcrowderは、JavaScriptが後読み（サポート情報）になり、正規表現自体で解決できることを指摘しました。

function numberWithCommas(x) {
    return x.toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
}

function numberWithCommas(x) {
    return x.toString().replace(/\B(?<!\.\d*)(?=(\d{3})+(?!\d))/g, ",");
}

function test(x, expect) {
    const result = numberWithCommas(x);
    const pass = result === expect;
    console.log(`${pass ? "✓" : "ERROR ====>"} ${x} => ${result}`);
    return pass;
}

let failures = 0;
failures += !test(0,               "0");
failures += !test(0.123456,        "0.123456");
failures += !test(100,             "100");
failures += !test(100.123456,      "100.123456");
failures += !test(1000,            "1,000");
failures += !test(1000.123456,     "1,000.123456");
failures += !test(10000,           "10,000");
failures += !test(10000.123456,    "10,000.123456");
failures += !test(100000,          "100,000");
failures += !test(100000.123456,   "100,000.123456");
failures += !test(1000000,         "1,000,000");
failures += !test(1000000.123456,  "1,000,000.123456");
failures += !test(10000000,        "10,000,000");
failures += !test(10000000.123456, "10,000,000.123456");
if (failures) {
    console.log(`${failures} test(s) failed`);
} else {
    console.log("All tests passed");
}

.as-console-wrapper {
    max-height: 100% !important;
}

(?<!\.\d*)否定的な後読みであり、一致の前に.0個以上の数字を付けることはできません。否定的な後読みは、少なくともV8ではsplitand join解（比較）よりも高速です。

Number.prototype.toLocaleStringについて誰も言及していないことに驚いています。JavaScript 1.5（1999年に導入）で実装されているため、基本的にすべての主要なブラウザーでサポートされています。

var n = 34523453.345
n.toLocaleString()
"34,523,453.345"

Intlを含めることにより、v0.12以降のNode.jsでも機能します。

この関数は数値ではなく文字列を返すことに注意してください。

別のものが必要な場合は、Numeral.jsが興味深いかもしれません。

var number = 1234567890; // Example number to be converted

java javascriptの最大整数値が9007199254740991であることに注意してください

toLocaleString：

number.toLocaleString(); // "1,234,567,890"

// A more complex example: 
var number2 = 1234.56789; // floating point example
number2.toLocaleString(undefined, {maximumFractionDigits:2}) // "1,234.57"

NumberFormat（ Safariはサポートされていません）：

var nf = new Intl.NumberFormat();
nf.format(number); // "1,234,567,890"

私がチェックしたところ（少なくともFirefox）から、パフォーマンスに関してはどちらもほぼ同じです。

phpjs.orgのnumber_format（）を使用することをお勧めします

function number_format(number, decimals, dec_point, thousands_sep) {
    // http://kevin.vanzonneveld.net
    // +   original by: Jonas Raoni Soares Silva (http://www.jsfromhell.com)
    // +   improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
    // +     bugfix by: Michael White (http://getsprink.com)
    // +     bugfix by: Benjamin Lupton
    // +     bugfix by: Allan Jensen (http://www.winternet.no)
    // +    revised by: Jonas Raoni Soares Silva (http://www.jsfromhell.com)
    // +     bugfix by: Howard Yeend
    // +    revised by: Luke Smith (http://lucassmith.name)
    // +     bugfix by: Diogo Resende
    // +     bugfix by: Rival
    // +      input by: Kheang Hok Chin (http://www.distantia.ca/)
    // +   improved by: davook
    // +   improved by: Brett Zamir (http://brett-zamir.me)
    // +      input by: Jay Klehr
    // +   improved by: Brett Zamir (http://brett-zamir.me)
    // +      input by: Amir Habibi (http://www.residence-mixte.com/)
    // +     bugfix by: Brett Zamir (http://brett-zamir.me)
    // +   improved by: Theriault
    // +   improved by: Drew Noakes
    // *     example 1: number_format(1234.56);
    // *     returns 1: '1,235'
    // *     example 2: number_format(1234.56, 2, ',', ' ');
    // *     returns 2: '1 234,56'
    // *     example 3: number_format(1234.5678, 2, '.', '');
    // *     returns 3: '1234.57'
    // *     example 4: number_format(67, 2, ',', '.');
    // *     returns 4: '67,00'
    // *     example 5: number_format(1000);
    // *     returns 5: '1,000'
    // *     example 6: number_format(67.311, 2);
    // *     returns 6: '67.31'
    // *     example 7: number_format(1000.55, 1);
    // *     returns 7: '1,000.6'
    // *     example 8: number_format(67000, 5, ',', '.');
    // *     returns 8: '67.000,00000'
    // *     example 9: number_format(0.9, 0);
    // *     returns 9: '1'
    // *    example 10: number_format('1.20', 2);
    // *    returns 10: '1.20'
    // *    example 11: number_format('1.20', 4);
    // *    returns 11: '1.2000'
    // *    example 12: number_format('1.2000', 3);
    // *    returns 12: '1.200'
    var n = !isFinite(+number) ? 0 : +number, 
        prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
        sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
        dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
        toFixedFix = function (n, prec) {
            // Fix for IE parseFloat(0.55).toFixed(0) = 0;
            var k = Math.pow(10, prec);
            return Math.round(n * k) / k;
        },
        s = (prec ? toFixedFix(n, prec) : Math.round(n)).toString().split('.');
    if (s[0].length > 3) {
        s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep);
    }
    if ((s[1] || '').length < prec) {
        s[1] = s[1] || '';
        s[1] += new Array(prec - s[1].length + 1).join('0');
    }
    return s.join(dec);
}

更新02/13/14

これは期待どおりに機能しないと人々が報告しているので、自動テストを含むJS Fiddleを実行しました。

2017年11月26日更新

これは、出力がわずかに変更されたスタックスニペットとしてのフィドルです。

function number_format(number, decimals, dec_point, thousands_sep) {
    // http://kevin.vanzonneveld.net
    // +   original by: Jonas Raoni Soares Silva (http://www.jsfromhell.com)
    // +   improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
    // +     bugfix by: Michael White (http://getsprink.com)
    // +     bugfix by: Benjamin Lupton
    // +     bugfix by: Allan Jensen (http://www.winternet.no)
    // +    revised by: Jonas Raoni Soares Silva (http://www.jsfromhell.com)
    // +     bugfix by: Howard Yeend
    // +    revised by: Luke Smith (http://lucassmith.name)
    // +     bugfix by: Diogo Resende
    // +     bugfix by: Rival
    // +      input by: Kheang Hok Chin (http://www.distantia.ca/)
    // +   improved by: davook
    // +   improved by: Brett Zamir (http://brett-zamir.me)
    // +      input by: Jay Klehr
    // +   improved by: Brett Zamir (http://brett-zamir.me)
    // +      input by: Amir Habibi (http://www.residence-mixte.com/)
    // +     bugfix by: Brett Zamir (http://brett-zamir.me)
    // +   improved by: Theriault
    // +   improved by: Drew Noakes
    // *     example 1: number_format(1234.56);
    // *     returns 1: '1,235'
    // *     example 2: number_format(1234.56, 2, ',', ' ');
    // *     returns 2: '1 234,56'
    // *     example 3: number_format(1234.5678, 2, '.', '');
    // *     returns 3: '1234.57'
    // *     example 4: number_format(67, 2, ',', '.');
    // *     returns 4: '67,00'
    // *     example 5: number_format(1000);
    // *     returns 5: '1,000'
    // *     example 6: number_format(67.311, 2);
    // *     returns 6: '67.31'
    // *     example 7: number_format(1000.55, 1);
    // *     returns 7: '1,000.6'
    // *     example 8: number_format(67000, 5, ',', '.');
    // *     returns 8: '67.000,00000'
    // *     example 9: number_format(0.9, 0);
    // *     returns 9: '1'
    // *    example 10: number_format('1.20', 2);
    // *    returns 10: '1.20'
    // *    example 11: number_format('1.20', 4);
    // *    returns 11: '1.2000'
    // *    example 12: number_format('1.2000', 3);
    // *    returns 12: '1.200'
    var n = !isFinite(+number) ? 0 : +number, 
        prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
        sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
        dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
        toFixedFix = function (n, prec) {
            // Fix for IE parseFloat(0.55).toFixed(0) = 0;
            var k = Math.pow(10, prec);
            return Math.round(n * k) / k;
        },
        s = (prec ? toFixedFix(n, prec) : Math.round(n)).toString().split('.');
    if (s[0].length > 3) {
        s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep);
    }
    if ((s[1] || '').length < prec) {
        s[1] = s[1] || '';
        s[1] += new Array(prec - s[1].length + 1).join('0');
    }
    return s.join(dec);
}

var exampleNumber = 1;
function test(expected, number, decimals, dec_point, thousands_sep)
{
    var actual = number_format(number, decimals, dec_point, thousands_sep);
    console.log(
        'Test case ' + exampleNumber + ': ' +
        '(decimals: ' + (typeof decimals === 'undefined' ? '(default)' : decimals) +
        ', dec_point: "' + (typeof dec_point === 'undefined' ? '(default)' : dec_point) + '"' +
        ', thousands_sep: "' + (typeof thousands_sep === 'undefined' ? '(default)' : thousands_sep) + '")'
    );
    console.log('  => ' + (actual === expected ? 'Passed' : 'FAILED') + ', got "' + actual + '", expected "' + expected + '".');
    exampleNumber++;
}

test('1,235',    1234.56);
test('1 234,56', 1234.56, 2, ',', ' ');
test('1234.57',  1234.5678, 2, '.', '');
test('67,00',    67, 2, ',', '.');
test('1,000',    1000);
test('67.31',    67.311, 2);
test('1,000.6',  1000.55, 1);
test('67.000,00000', 67000, 5, ',', '.');
test('1',        0.9, 0);
test('1.20',     '1.20', 2);
test('1.2000',   '1.20', 4);
test('1.200',    '1.2000', 3);

.as-console-wrapper {
  max-height: 100% !important;
}

これは@ mikez302の回答のバリエーションですが、小数を含む数値をサポートするように変更されています（@ neu-rahのフィードバックにより、numberWithCommas（12345.6789）->「12,345.6789」ではなく「12,345.6,789」

function numberWithCommas(n) {
    var parts=n.toString().split(".");
    return parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",") + (parts[1] ? "." + parts[1] : "");
}

function formatNumber (num) {
    return num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")
}

print(formatNumber(2665));      // 2,665
print(formatNumber(102665));    // 102,665
print(formatNumber(111102665)); // 111,102,665

正規表現を使用する

function toCommas(value) {
    return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
console.log(toCommas(123456789)); // 123,456,789

console.log(toCommas(1234567890)); // 1,234,567,890
console.log(toCommas(1234)); // 1,234

toLocaleString（）の使用

var number = 123456.789;

// request a currency format
console.log(number.toLocaleString('de-DE', { style: 'currency', currency: 'EUR' }));
// → 123.456,79 €

// the Japanese yen doesn't use a minor unit
console.log(number.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }))
// → ￥123,457

// limit to three significant digits
console.log(number.toLocaleString('en-IN', { maximumSignificantDigits: 3 }));
// → 1,23,000

ref MDN：Number.prototype.toLocaleString（）

Intl.NumberFormat（）の使用

var number = 123456.789;

console.log(new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(number));
// expected output: "123.456,79 €"

// the Japanese yen doesn't use a minor unit
console.log(new Intl.NumberFormat('ja-JP', { style: 'currency', currency: 'JPY' }).format(number));
// expected output: "￥123,457"

// limit to three significant digits
console.log(new Intl.NumberFormat('en-IN', { maximumSignificantDigits: 3 }).format(number));

// expected output: "1,23,000"

ref Intl.NumberFormat

ここでデモ

<script type="text/javascript">
  // Using Regular expression
  function toCommas(value) {
    return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  }

  function commas() {
    var num1 = document.myform.number1.value;

    // Using Regular expression
    document.getElementById('result1').value = toCommas(parseInt(num1));
    // Using toLocaleString()

    document.getElementById('result2').value = parseInt(num1).toLocaleString('ja-JP', {
      style: 'currency',
      currency: 'JPY'
    });

    // Using Intl.NumberFormat()
    document.getElementById('result3').value = new Intl.NumberFormat('ja-JP', {
      style: 'currency',
      currency: 'JPY'
    }).format(num1);
  }
</script>
<FORM NAME="myform">
  <INPUT TYPE="text" NAME="number1" VALUE="123456789">
  <br>
  <INPUT TYPE="button" NAME="button" Value="=>" onClick="commas()">
  <br>Using Regular expression
  <br>
  <INPUT TYPE="text" ID="result1" NAME="result1" VALUE="">
  <br>Using toLocaleString()
  <br>
  <INPUT TYPE="text" ID="result2" NAME="result2" VALUE="">
  <br>Using Intl.NumberFormat()
  <br>
  <INPUT TYPE="text" ID="result3" NAME="result3" VALUE="">

</FORM>

パフォーマンス

http://jsben.ch/sifRd

Intl.NumberFormat

ネイティブJS関数。IE11、Edge、最新のSafari、Chrome、Firefox、Opera、iOSのSafari、AndroidのChromeでサポートされています。

var number = 3500;

console.log(new Intl.NumberFormat().format(number));
// → '3,500' if in US English locale

返信ありがとうございます。私はいくつかの答えを基に、より「万能」のソリューションを作成しました。

最初のスニペットは、その模倣の機能追加PHPのをnumber_format()数プロトタイプに。数値をフォーマットする場合、通常は小数点以下の桁数が必要なので、関数は表示する小数点以下の桁数を取り込みます。一部の国では、小数点としてカンマを使用し、桁区切り記号として小数点を使用しているため、関数でこれらの区切り記号を設定できます。

Number.prototype.numberFormat = function(decimals, dec_point, thousands_sep) {
    dec_point = typeof dec_point !== 'undefined' ? dec_point : '.';
    thousands_sep = typeof thousands_sep !== 'undefined' ? thousands_sep : ',';

    var parts = this.toFixed(decimals).split('.');
    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, thousands_sep);

    return parts.join(dec_point);
}

これは次のように使用します。

var foo = 5000;
console.log(foo.numberFormat(2)); // us format: 5,000.00
console.log(foo.numberFormat(2, ',', '.')); // european format: 5.000,00

数値演算のために数値を戻す必要があることがよくありましたが、parseFloatは5,000を5に変換し、単に整数値の最初のシーケンスを取得します。そこで、独自のフロート変換関数を作成し、それをStringプロトタイプに追加しました。

String.prototype.getFloat = function(dec_point, thousands_sep) {
    dec_point = typeof dec_point !== 'undefined' ? dec_point : '.';
    thousands_sep = typeof thousands_sep !== 'undefined' ? thousands_sep : ',';

    var parts = this.split(dec_point);
    var re = new RegExp("[" + thousands_sep + "]");
    parts[0] = parts[0].replace(re, '');

    return parseFloat(parts.join(dec_point));
}

これで、次のように両方の関数を使用できます。

var foo = 5000;
var fooString = foo.numberFormat(2); // The string 5,000.00
var fooFloat = fooString.getFloat(); // The number 5000;

console.log((fooString.getFloat() + 1).numberFormat(2)); // The string 5,001.00

この質問に対する回答の数には非常に感銘を受けました。私はuKolkaの答えが好きです：

n.toLocaleString()

しかし、残念なことに、スペイン語などの一部のロケールでは、10,000未満の数値では期待どおりに機能しません（IMHO）。

Number(1000).toLocaleString('ES-es')

与える1000としない1.000。

理由を知るには、すべてのブラウザーでtoLocaleStringが10000未満の数値で機能しないことを参照してください。

したがって、正しい千桁区切り文字を選択するエリアスザマリアの答えを使用する必要がありました。

n.toString().replace(/\B(?=(\d{3})+(?!\d))/g, Number(10000).toLocaleString().substring(2, 3))

これは、桁区切り記号を使用する、,または.桁区切り記号として使用する両方のロケールのワンライナーとして適切に機能し、すべてのケースで1,000から機能し始めます。

Number(1000).toString().replace(/\B(?=(\d{3})+(?!\d))/g, Number(10000).toLocaleString().substring(2, 3))

与える1.000スペイン語ロケールのコンテキストで。

数値のフォーマット方法を完全に制御したい場合は、次の方法も試してください。

let number   = 1234.567
let decimals = 2
let decpoint = '.' // Or Number(0.1).toLocaleString().substring(1, 2)
let thousand = ',' // Or Number(10000).toLocaleString().substring(2, 3)

let n = Math.abs(number).toFixed(decimals).split('.')
n[0] = n[0].split('').reverse().map((c, i, a) =>
  i > 0 && i < a.length && i % 3 == 0 ? c + thousand : c
).reverse().join('')
let final = (Math.sign(number) < 0 ? '-' : '') + n.join(decpoint)

console.log(final)

与える1,234.57。

これは正規表現を必要としません。最初に数値を希望の小数点以下の桁数に調整しtoFixed、次に小数点がある.場合は小数点で除算して機能します。次に、左側が数字の配列に変換され、反転されます。次に、最初から3桁ごとに3桁ごとの区切り文字が追加され、結果が再び逆になります。最終結果は、2つの部分の結合です。入力番号の符号はMath.abs最初に削除され、必要に応じて元に戻されます。

ワンライナーではありませんが、それほど長くはなく、簡単に関数に変換できます。明確にするために変数が追加されていますが、事前にわかっている場合は、目的の値に置き換えることができます。toLocaleString現在のロケールの小数点と3桁ごとの区切り文字の正しい文字を見つける方法として使用する式を使用できます（これらにはより最新のJavascriptが必要であることを覚えておいてください）。

これは、これを行う最も短い正規表現だと思います。

/\B(?=(\d{3})+\b)/g

"123456".replace(/\B(?=(\d{3})+\b)/g, ",")

私はいくつかの番号でそれをチェックし、それはうまくいきました。

Number.prototype.toLocaleString()すべてのブラウザ（Safari）によってネイティブに提供されていれば、すばらしいでしょう。

他のすべての回答をチェックしましたが、誰もそれをポリフィルするようには見えませんでした。これは、実際の最初の2つの回答を組み合わせたものです。toLocaleString機能する場合はそれを使用し、機能しない場合はカスタム関数を使用します。

var putThousandsSeparators;

putThousandsSeparators = function(value, sep) {
  if (sep == null) {
    sep = ',';
  }
  // check if it needs formatting
  if (value.toString() === value.toLocaleString()) {
    // split decimals
    var parts = value.toString().split('.')
    // format whole numbers
    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, sep);
    // put them back together
    value = parts[1] ? parts.join('.') : parts[0];
  } else {
    value = value.toLocaleString();
  }
  return value;
};

alert(putThousandsSeparators(1234567.890));

桁区切り記号は、ブラウザのIntlオブジェクトを使用して、国際的に扱いやすい方法で挿入できます。

Intl.NumberFormat().format(1234);
// returns "1,234" if the user's locale is en_US, for example

詳細については、NumberFormatに関するMDNの記事を参照してください。ロケールの動作を指定したり、ユーザーのデフォルトを指定したりできます。ローカルの違いを尊重するため、これはもう少し簡単です。多くの国ではピリオドを使用して数字を区切りますが、コンマは小数点を示します。

Intl.NumberFormatはまだすべてのブラウザーで使用できるわけではありませんが、最新のChrome、Opera、IEで動作します。Firefoxの次のリリースでサポートされる予定です。Webkitには実装のタイムラインがないようです。

この手順を使用して、必要な通貨をフォーマットできます。

var nf = new Intl.NumberFormat('en-US', {
  style: 'currency',
  currency: 'USD',
  minimumFractionDigits: 2,
  maximumFractionDigits: 2
});
nf.format(123456.789); // ‘$123,456.79’

詳細については、このリンクにアクセスできます。

https://www.justinmccandless.com/post/formatting-currency-in-javascript/

通貨の値を扱い、多くの書式を設定している場合は、多くのエッジケースとローカリゼーションを処理する小さなaccounting.jsを追加することをお勧めします。

// Default usage:
accounting.formatMoney(12345678); // $12,345,678.00

// European formatting (custom symbol and separators), could also use options object as second param:
accounting.formatMoney(4999.99, "€", 2, ".", ","); // €4.999,99

// Negative values are formatted nicely, too:
accounting.formatMoney(-500000, "£ ", 0); // £ -500,000

// Simple `format` string allows control of symbol position [%v = value, %s = symbol]:
accounting.formatMoney(5318008, { symbol: "GBP",  format: "%v %s" }); // 5,318,008.00 GBP

次のコードはcharスキャンを使用しているため、正規表現はありません。

function commafy( num){
  var parts = (''+(num<0?-num:num)).split("."), s=parts[0], L, i=L= s.length, o='';
  while(i--){ o = (i===0?'':((L-i)%3?'':',')) 
                  +s.charAt(i) +o }
  return (num<0?'-':'') + o + (parts[1] ? '.' + parts[1] : ''); 
}

それは有望なパフォーマンスを示しています：http : //jsperf.com/number-formatting-with-commas/5

2015.4.26：num <0の場合の問題を解決するためのマイナーな修正。https://jsfiddle.net/runsun/p5tqqvs3/を参照してください

これは、桁区切り記号にカンマを挿入する単純な関数です。RegExではなく配列関数を使用します。

/**
 * Format a number as a string with commas separating the thousands.
 * @param num - The number to be formatted (e.g. 10000)
 * @return A string representing the formatted number (e.g. "10,000")
 */
var formatNumber = function(num) {
    var array = num.toString().split('');
    var index = -3;
    while (array.length + index > 0) {
        array.splice(index, 0, ',');
        // Decrement by 4 since we just added another unit to the array.
        index -= 4;
    }
    return array.join('');
};

コードサンドボックスと例のリンク：https ://codesandbox.io/s/p38k63w0vq

このコードを使用して、インドの通貨形式を処理します。国コードは、他の国の通貨を処理するように変更できます。

let amount =350256.95
var formatter = new Intl.NumberFormat('en-IN', {
  minimumFractionDigits: 2,
});

// Use it.

formatter.format(amount);

出力：

3,50,256.95

Intl.NumberFormatを使用することもできますコンストラクターを。これを行う方法は次のとおりです。

 resultNumber = new Intl.NumberFormat('en-IN', { maximumSignificantDigits: 3 }).format(yourNumber); 

私はこの投稿につまずく前にこれを書いた。正規表現はなく、実際にコードを理解できます。

$(function(){
  
  function insertCommas(s) {

    // get stuff before the dot
    var d = s.indexOf('.');
    var s2 = d === -1 ? s : s.slice(0, d);

    // insert commas every 3 digits from the right
    for (var i = s2.length - 3; i > 0; i -= 3)
      s2 = s2.slice(0, i) + ',' + s2.slice(i);

    // append fractional part
    if (d !== -1)
      s2 += s.slice(d);

    return s2;

  }
  
  
  $('#theDudeAbides').text( insertCommas('1234567.89012' ) );
  
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div id="theDudeAbides"></div>

var formatNumber = function (number) {
  var splitNum;
  number = Math.abs(number);
  number = number.toFixed(2);
  splitNum = number.split('.');
  splitNum[0] = splitNum[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  return splitNum.join(".");
}

編集：関数は正の数でのみ機能します。例：

var number = -123123231232;
formatNumber(number)

出力：「123,123,231,232」

しかし、上記の質問に答えることtoLocaleString()は問題を解決するだけです。

var number = 123123231232;
    number.toLocaleString()

出力：「123,123,231,232」

元気！

私の答えは、jQueryをはるかに賢明な代替手段で完全に置き換える唯一の答えです。

function $(dollarAmount)
{
    const locale = 'en-US';
    const options = { style: 'currency', currency: 'USD' };
    return Intl.NumberFormat(locale, options).format(dollarAmount);
}

このソリューションは、カンマを追加するだけでなく、$(1000.9999)$ 1,001.00を取得するような金額を入力した場合に、最も近いペニーに丸めます。さらに、入力する値は、数値または文字列にすることができます。それは問題ではありません。

お金を扱っているが、金額に先行ドル記​​号を表示したくない場合は、この関数を追加することもできます。この関数は、前の関数を使用しますが、を削除し$ます。

function no$(dollarAmount)
{
    return $(dollarAmount).replace('$','');
}

あなたがお金を扱っておらず、10進数のフォーマット要件がさまざまである場合は、より用途の広い関数を次に示します。

function addCommas(number, minDecimalPlaces = 0, maxDecimalPlaces = Math.max(3,minDecimalPlaces))
{
    const options = {};
    options.maximumFractionDigits = maxDecimalPlaces;
    options.minimumFractionDigits = minDecimalPlaces;
    return Intl.NumberFormat('en-US',options).format(number);
}

ああ、ところで、このコードが一部の古いバージョンのInternet Explorerで機能しないという事実は、完全に意図的なものです。私は、IEが最新の標準をサポートしていないことを検出できる場合はいつでもIEを壊そうとします。

コメントセクションでの過度の称賛はトピック外と見なされることを覚えておいてください。代わりに、私に賛成投票をしてください。

私にとって、最良の答えは、一部のメンバーが言ったようにtoLocaleStringを使用することです。「$」記号を含める場合は、languajeとタイプオプションを追加するだけです。以下は、メキシコペソに数値をフォーマットする例です

var n = 1234567.22
alert(n.toLocaleString("es-MX",{style:"currency", currency:"MXN"}))

近道

1234567.22.toLocaleString("es-MX",{style:"currency", currency:"MXN"})

uKolkaの回答を改善して、他の人が時間を節約できるように手助けしよう。

Numeral.jsを使用します。

document.body.textContent = numeral(1234567).format('0,0');

<script src="//cdnjs.cloudflare.com/ajax/libs/numeral.js/1.4.5/numeral.min.js"></script>

ブラウザの互換性に問題がない場合にのみ、Number.prototype.toLocaleString（）を使用する必要があります。

別の方法で、小数、異なるセパレーター、ネガをサポートします。

var number_format = function(number, decimal_pos, decimal_sep, thousand_sep) {
    var ts      = ( thousand_sep == null ? ',' : thousand_sep )
        , ds    = ( decimal_sep  == null ? '.' : decimal_sep )
        , dp    = ( decimal_pos  == null ? 2   : decimal_pos )

        , n     = Math.floor(Math.abs(number)).toString()

        , i     = n.length % 3 
        , f     = ((number < 0) ? '-' : '') + n.substr(0, i)
    ;

    for(;i<n.length;i+=3) {
        if(i!=0) f+=ts;
        f+=n.substr(i,3);
    }

    if(dp > 0) 
        f += ds + parseFloat(number).toFixed(dp).split('.')[1]

    return f;
}

@Jignesh Sanghaniによるいくつかの修正、彼のコメントに賛成投票することを忘れないでください。

この機能は、この問題に関連するすべての問題を処理すると思います。

function commaFormat(inputString) {
    inputString = inputString.toString();
    var decimalPart = "";
    if (inputString.indexOf('.') != -1) {
        //alert("decimal number");
        inputString = inputString.split(".");
        decimalPart = "." + inputString[1];
        inputString = inputString[0];
        //alert(inputString);
        //alert(decimalPart);

    }
    var outputString = "";
    var count = 0;
    for (var i = inputString.length - 1; i >= 0 && inputString.charAt(i) != '-'; i--) {
        //alert("inside for" + inputString.charAt(i) + "and count=" + count + " and outputString=" + outputString);
        if (count == 3) {
            outputString += ",";
            count = 0;
        }
        outputString += inputString.charAt(i);
        count++;
    }
    if (inputString.charAt(0) == '-') {
        outputString += "-";
    }
    //alert(outputString);
    //alert(outputString.split("").reverse().join(""));
    return outputString.split("").reverse().join("") + decimalPart;
}

将来のGoogle社員のみ（または必ずしも「Google社員」ではない）：

上記のソリューションはすべて素晴らしいものですが、そのような状況でRegExpを使用するのはひどく悪いことかもしれません。

したがって、はい、提案されたオプションのいくつかを使用するか、次のような原始的でありながら便利なものを書くことさえできます。

const strToNum = str => {

   //Find 1-3 digits followed by exactly 3 digits & a comma or end of string
   let regx = /(\d{1,3})(\d{3}(?:,|$))/;
   let currStr;

   do {
       currStr = (currStr || str.split(`.`)[0])
           .replace( regx, `$1,$2`)
   } while (currStr.match(regx)) //Stop when there's no match & null's returned

   return ( str.split(`.`)[1] ) ?
           currStr.concat(`.`, str.split(`.`)[1]) :
           currStr;

};

strToNum(`123`) // => 123
strToNum(`123456`) // => 123,456
strToNum(`-1234567.0987`) // => -1,234,567.0987

ここで使用される正規表現はかなり単純であり、ループはジョブを完了するために必要な回数正確に実行されます。

そして、あなたはそれをはるかに良く、「DRYify」コードなどを最適化するかもしれません。

まだ、

(-1234567.0987).toLocaleString();

（ほとんどの場合）はるかに良い選択です。

ポイントは、実行速度やブラウザ間の互換性ではありません。

結果の数値をユーザーに表示したい場合は、.toLocaleString（）メソッドを使用すると、ウェブサイトまたはアプリのユーザーと同じ言語を話すことができます（ユーザーの言語に関係なく）。

ECMAScriptのドキュメントによると、この方法は1999年に導入されました。その理由は、インターネットがいつか世界中の人々をつなぐという希望だったので、いくつかの「内部化」ツールが必要でした。

今日、インターネットは私たち全員を結びつけているので、世界は私たちが想像するよりもはるかに複雑であり、（ほとんど）私たち全員がここにいることを覚えておくことが重要です。

明らかに、人々の多様性を考えると、私たちはさまざまな言語を話し、さまざまなことを評価しているため、すべての人に完璧なUXを保証することは不可能です。そして、これが理由で、できるだけローカライズすることはさらに重要です。

したがって、日付、時刻、数値などを表すための特定の基準があること、およびそれらを最終的なユーザーが好む形式で表示するツールがあることを考えると、それほど珍しくなく、ほとんど無責任ではありません。そのツールを使用しますか（特にこのデータをユーザーに表示したい場合）？

私にとっては、.toLocaleString（）の代わりにRegExpを使用するような状況で、JavaScriptを使用して時計アプリを作成し、それをこのようにハードコーディングして、プラハの時間のみを表示するように聞こえます（これは、プラハに住んでいない人）のデフォルトの動作にもかかわらず

new Date();

最終的なユーザーのクロックに従ってデータを返すことです。

_{愛するワンライナーのための}私の「真の」正規表現のみのソリューション

上記の熱狂的なプレイヤーがいますか？多分それからゴルフをすることができます。これが私のストロークです。

n => `${n}`.replace(/(?<!\.\d+)\B(?=(\d{3})+\b)/g, " ").replace(/(?<=\.(\d{3})+)\B/g, " ")

_{国際単位系が彼らの出版物「SIパンフレット：国際単位系（SI）」の第8版（2006）で行うと述べたように、千の区切り文字に 薄いスペース（U + 2009）を使用します（§5.3を参照） .4。）。第9版（2019）では、スペースを使用することを提案しています（§5.4.4を参照）。コンマを含め、何でも使用できます。}

見る。

const integer_part_only = n => `${n}`.replace(/(?<!\.\d+)\B(?=(\d{3})+\b)/g, " I ");
const fractional_part_only = n => `${n}`.replace(/(?<=\.(\d{3})+)\B/g, " F ");
const both = n => fractional_part_only(integer_part_only(n));

function demo(number) { // I’m using Chrome 74.
	console.log(`${number}
		→ "${integer_part_only(number)}" (integer part only)
		→ "${fractional_part_only(number)}" (fractional part only)
		→ "${both(number)}" (both)
	`);
}
demo(Math.random() * 10e5);
demo(123456789.01234567);
demo(123456789);
demo(0.0123456789);

どのように機能しますか？

整数部分の場合

.replace(/(?<!\.\d+)\B(?=(\d{3})+\b)/g, " I ")

• .replace(……, " I ") 「私」を置く
  • /……/g それぞれの
    • \B 2つの隣接する数字の中間
      • (?=……)正しい部分が正の _{ルックヘッド}
        • (\d{3})+ 1つ以上の3桁のチャンク
        • \b ピリオド、文字列の終わりなどの非数字が続く
      • (?<!……)_{NEGATIVE LOOKBEHIND}左の部分を除く
        • \.\d+ ドットとそれに続く数字です（「小数点区切り文字があります」）。

小数部の場合

.replace(/(?<=\.(\d{3})+)\B/g, " F ")

• .replace(……, " F ") 「F」を付ける
  • /……/g それぞれの
    • \B 2つの隣接する数字の中間
      • (?<=……)左部分が _{正のルックハインド}
        • \. 小数点記号
        • (\d{3})+ その後に1つ以上の3桁のチャンクが続きます。

文字クラスと境界

\d

任意の数字（アラビア数字）に一致します。に相当し[0-9]ます。

例えば、

• /\d/またはで/[0-9]/一致2しB2 is the suite numberます。

\b

単語の境界に一致します。これは、文字とスペースの間など、単語文字の後に、または他の単語文字が前にない位置です。一致した単語の境界は一致に含まれないことに注意してください。つまり、一致した単語の境界の長さはゼロです。

例：

• /\bm/に一致mしmoonます。
• /oo\b/ooin moonとは一致しません。これは、単語文字であるがoo後に続くためですn。
• /oon\b/oonin moonに一致しoonます。これは、が文字列の終わりであり、したがって単語文字が続かないためです。
• /\w\b\w/ 単語文字の後に非単語文字と単語文字の両方を続けることはできないため、は何にも一致しません。

\B

非単語境界に一致します。これは、前の文字と次の文字が同じタイプである位置です。両方が単語であるか、両方が非単語である必要があります。2つの文字間や2つのスペース間など。文字列の最初と最後は非単語と見なされます。一致した単語の境界と同様に、一致した非単語の境界も一致に含まれません。

例えば、

• /\Bon/に一致onしat noonます。
• /ye\B/で一致yeしpossibly yesterdayます。

ブラウザの互換性

• https://caniuse.com/#feat=js-regexp-lookbehind

Aki143Sのソリューションにtofixedを追加しました。このソリューションでは、桁区切り記号にはドットを使用し、精度にはカンマを使用しています。

function formatNumber( num, fixed ) { 
    var decimalPart;

    var array = Math.floor(num).toString().split('');
    var index = -3; 
    while ( array.length + index > 0 ) { 
        array.splice( index, 0, '.' );              
        index -= 4;
    }

    if(fixed > 0){
        decimalPart = num.toFixed(fixed).split(".")[1];
        return array.join('') + "," + decimalPart; 
    }
    return array.join(''); 
};

例;

formatNumber(17347, 0)  = 17.347
formatNumber(17347, 3)  = 17.347,000
formatNumber(1234563.4545, 3)  = 1.234.563,454

すでに良い答えがたくさんあります。楽しみのためにもう1つ紹介します。

function format(num, fix) {
    var p = num.toFixed(fix).split(".");
    return p[0].split("").reduceRight(function(acc, num, i, orig) {
        if ("-" === num && 0 === i) {
            return num + acc;
        }
        var pos = orig.length - i - 1
        return  num + (pos && !(pos % 3) ? "," : "") + acc;
    }, "") + (p[1] ? "." + p[1] : "");
}

いくつかの例：

format(77.03453, 2); // "77.03"
format(78436589374); // "78,436,589,374"
format(784, 4);      // "784.0000"
format(-123456);     // "-123,456"