web-dev-qa-db-ja.com

Javascript千区切り/文字列形式

Javascriptに数値と文字列をフォーマットする機能はありますか？

私は文字列または数字の千の区切りの方法を探しています...（C＃のString.Formatのように）

javascriptstringnumbersformat
76
LostLord

更新（7年後）

以下の元の回答で引用された参考文献は間違っていました。そこにはこれのための組み込み関数です。これはまさに kaiser が以下に示唆するものです：toLocaleString

だからあなたができる：

(1234567.89).toLocaleString('en')              // for numeric input
parseFloat("1234567.89").toLocaleString('en')  // for string input

以下に実装されている関数も機能しますが、単に必要ではありません。

（幸運にも2010年に（）が必要だったと思うかもしれませんが、いいえ。これによると より信頼できるリファレンス 、toLocaleString ECMAScript 3rd Edition [1999]以来標準の一部であり、IE 5.5までサポートされていたと思われます。）

元の回答

このリファレンス によると、数値にカンマを追加するための組み込み関数はありません。しかし、そのページには自分でコーディングする方法の例が含まれています。

function addCommas(nStr) {
    nStr += '';
    var x = nStr.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;
}

Edit：他の方法（カンマを含む文字列を数値に変換する）にするには、次のようにします。

parseFloat("1,234,567.89".replace(/,/g,''))
118
Tim Goodman

約localizing千単位の区切り文字、区切り文字、および小数点区切り文字の場合は、次のようにします。

// --> numObj.toLocaleString( [locales [, options] ] )
parseInt( number ).toLocaleString();

使用できるオプションがいくつかあります（フォールバックのあるロケールもあります）：

number = 123456.7089;

result  = parseInt( number ).toLocaleString() + "<br>";
result += number.toLocaleString( 'de-DE' ) + "<br>";
result += number.toLocaleString( 'ar-EG' ) + "<br>";
result += number.toLocaleString( 'ja-JP', { 
  style           : 'currency',
  currency        : 'JPY',
  currencyDisplay : 'symbol',
  useGrouping     : true
} ) + "<br>";
result += number.toLocaleString( [ 'jav', 'en' ], { 
  localeMatcher            : 'lookup',
  style                    : 'decimal',
  minimumIntegerDigits     : 2,
  minimumFractionDigits    : 2,
  maximumFractionDigits    : 3,
  minimumSignificantDigits : 2,
  maximumSignificantDigits : 3
} ) + "<br>";

var el = document.getElementById( 'result' );
el.innerHTML = result;
<div id="result"></div>

MDN情報ページ の詳細。

Edit：Commentor @ I Serenaが好き は以下を追加します：

まだ英語の書式設定が必要な英語以外のロケールのブラウザをサポートするには、value.toLocaleString('en')を使用します。浮動小数点でも機能します。

121
kaiser

ECMAScript2018の変更に合わせて、後読みサポートを使用して更新されました。
後方互換性のために、さらに下にスクロールして元のソリューションを確認してください。

正規表現を使用できます-文字列として格納されている大きな数値を扱う場合に特に便利です。

const format = num => 
    String(num).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')

;[
    format(100),                           // "100"
    format(1000),                          // "1,000"
    format(1e10),                          // "10,000,000,000"  
    format(1000.001001),                   // "1,000.001001"
    format('100000000000000.001001001001') // "100,000,000,000,000.001001001001
]
    .forEach(n => console.log(n))

"詳細な正規表現の説明（regex101.com）flow diagram

この元の回答は必須ではありませんが、下位互換性のために使用できます。

単一の正規表現でこれを処理しようとすると（コールバックなし）私の現在の能力は、Javascriptでネガティブな後読みがないために失敗します...以下は、ほとんどの一般的なケースで機能する別の簡潔な代替手段です。ピリオドのインデックスの後に一致のインデックスが表示される場合、一致を無視して小数点を考慮します。

const format = num => {
    const n = String(num),
          p = n.indexOf('.')
    return n.replace(
        /\d(?=(?:\d{3})+(?:\.|$))/g,
        (m, i) => p < 0 || i < p ? `${m},` : m
    )
}

;[
    format(100),                           // "100"
    format(1000),                          // "1,000"
    format(1e10),                          // "10,000,000,000"  
    format(1000.001001),                   // "1,000.001001"
    format('100000000000000.001001001001') // "100,000,000,000,000.001001001001
]
    .forEach(n => console.log(n))

"詳細な正規表現の説明（regex101.com）

flow diagram

28
Emissary

Nice jQuery番号プラグインがあります： https://github.com/teamdf/jquery-number

これにより、10進数のオプションと10進数と1000桁の区切り文字のオプションを使用して、好きな形式で任意の数値を変更できます。

$.number(12345.4556, 2);          // -> 12,345.46
$.number(12345.4556, 3, ',', ' ') // -> 12 345,456

上記と同じオプションを使用して、入力フィールド内で直接使用できます。

$("input").number(true, 2);

または、セレクターを使用してDOM要素のセット全体に適用できます。

$('span.number').number(true, 2);
9
qdev
// thousand separates a digit-only string using commas
// by element:  onkeyup = "ThousandSeparate(this)"
// by ID:       onkeyup = "ThousandSeparate('txt1','lbl1')"
function ThousandSeparate()
{
    if (arguments.length == 1)
    {
        var V = arguments[0].value;
        V = V.replace(/,/g,'');
        var R = new RegExp('(-?[0-9]+)([0-9]{3})'); 
        while(R.test(V))
        {
            V = V.replace(R, '$1,$2');
        }
        arguments[0].value = V;
    }
    else  if ( arguments.length == 2)
    {
        var V = document.getElementById(arguments[0]).value;
        var R = new RegExp('(-?[0-9]+)([0-9]{3})'); 
        while(R.test(V))
        {
            V = V.replace(R, '$1,$2');
        }
        document.getElementById(arguments[1]).innerHTML = V;
    }
    else return false;
}
5
h.foroutan

私はこれを使用します：

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

ソース： リンク

4
Abhishek Goel
var number = 35002343;

console.log(number.toLocaleString());

ここで確認できるリファレンスについては、 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString

4
vikashraj144

JavaScriptを使用できます。以下はコードです。accept数値と1つのdotのみです。

ここにjavascriptがあります

<script >

            function FormatCurrency(ctrl) {
                //Check if arrow keys are pressed - we want to allow navigation around textbox using arrow keys
                if (event.keyCode == 37 || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40) {
                    return;
                }

                var val = ctrl.value;

                val = val.replace(/,/g, "")
                ctrl.value = "";
                val += '';
                x = val.split('.');
                x1 = x[0];
                x2 = x.length > 1 ? '.' + x[1] : '';

                var rgx = /(\d+)(\d{3})/;

                while (rgx.test(x1)) {
                    x1 = x1.replace(rgx, '$1' + ',' + '$2');
                }

                ctrl.value = x1 + x2;
            }

            function CheckNumeric() {
                return event.keyCode >= 48 && event.keyCode <= 57 || event.keyCode == 46;
            }

  </script>

HTML

<input type="text" onkeypress="return CheckNumeric()" onkeyup="FormatCurrency(this)" />

デモJSFIDDLE

3
Awtszs
number = 123456.7089;
result = parseInt( number ).toLocaleString() + "<br>";
result = number.toLocaleString( 'pt-BR' ) + "<br>";

var el = document.getElementById( 'result' );
el.innerHTML = result;

<div id="result"></div>
2
Ricardo

あなたがする必要があるのは、ただ本当に this ：

123000.9123.toLocaleString()
//result will be "123,000.912"
1
Ezeewei

PHP.jsには、これを行うための number_format という関数があります。 PHPに精通している場合、動作します まったく同じ方法 。

1
istvanp

反応のためのソリューションの組み合わせ

  let converter = Intl.NumberFormat();
  let salary =  monthlySalary.replace(/,/g,'')
  console.log(converter.format(salary))

  this.setState({
    monthlySalary: converter.format(salary)
  })
}

handleOnChangeMonthlySalary(1000)```
0
Chinedu Ofor