Javascript Bin Ayırıcı / dize biçimi [yinelenen]

Javascript'te sayı ve dizeleri biçimlendirmek için herhangi bir işlev var mı?

Dize veya sayılar için bin ayırıcı için bir yol arıyorum ... (String.Format In c # gibi)

Güncelleme (7 yıl sonra)

Aşağıdaki orijinal cevapta belirtilen referans yanlıştı. Bunun için yerleşik bir işlev vardır , kaiser'in aşağıda önerdiği tam olarak budur :toLocaleString

Böylece şunları yapabilirsiniz:

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

Aşağıda uygulanan işlev de çalışır, ancak gerekli değildir.

(Ben şanslı olsun ve onu öğrenmek istiyorum belki düşünce oldu , 2010 yılında gerekli geri ama olmaz. Buna göre daha güvenilir referans , toLocaleString ben aracı inanın ECMAScript 3rd Edition [1999], çünkü standart bir parçası olmuştur IE 5.5'e kadar desteklenirdi.)

Orijinal Cevap

Bu referansa göre, bir sayıya virgül eklemek için yerleşik bir işlev yoktur. Ancak bu sayfa, kendiniz nasıl kodlayacağınıza dair bir örnek içerir:

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;
}

Düzenleme: Diğer yöne gitmek için (dizeyi virgülle sayıya çevirmek), şöyle bir şey yapabilirsiniz:

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

İlgiliyse lokalize binlerce ayırıcılar, ayraçları ve ondalık ayırıcılar, aşağıdaki ile gidin:

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

Kullanabileceğiniz birkaç seçenek (ve hatta yedek içeren yerel ayarlar) vardır:

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>

İlgili ayrıntılar MDN bilgi sayfasında .

Düzenleme: Commentor @I like Serena şunları ekler:

Hala İngilizce biçimlendirmesini istediğimiz İngilizce olmayan yerel ayara sahip tarayıcıları desteklemek için value.toLocaleString('en'). Ayrıca kayan nokta için de çalışır.

ECMAScript2018 değişiklikleri doğrultusunda geriye dönük destek kullanılarak güncellendi.
Geriye dönük uyumluluk için orijinal çözümü görmek üzere aşağı kaydırın.

Düzenli bir ifade kullanılabilir - özellikle dizge olarak saklanan büyük sayılarla uğraşmak için kullanışlıdır.

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))

»Ayrıntılı normal ifade açıklaması (regex101.com)

Bu orijinal cevap gerekli olmayabilir, ancak geriye dönük uyumluluk için kullanılabilir.

Bunu tek bir düzenli ifadeyle (geri arama olmadan) halletmeye çalışmak, şu anki yeteneğim Javascript'te olumsuz bir geriye bakma eksikliğimden beni başarısızlığa uğratıyor ... bir dönemin dizininden sonra eşleşme dizininin göründüğü eşleşmeleri yok sayarak.

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))

»Ayrıntılı normal ifade açıklaması (regex101.com)

Güzel bir jQuery numarası eklentisi var: https://github.com/teamdf/jquery-number

Ondalık basamaklar için seçenekler ve ondalık ve bin için ayırıcı karakterler ile, istediğiniz formattaki herhangi bir sayıyı değiştirmenize olanak tanır:

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

Yukarıdaki gibi aynı seçenekleri kullanarak doğrudan giriş alanlarında kullanabilirsiniz, bu daha hoş:

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

Veya seçiciyi kullanarak tüm DOM öğeleri kümesine uygulayabilirsiniz:

$('span.number').number(true, 2);

Bunu kullanıyorum:

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

kaynak: bağlantı

// 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;
}   

var number = 35002343;

console.log(number.toLocaleString());

referans için burayı kontrol edebilirsiniz https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString

PHP.js bu denilen yapmak için bir işlevi vardır number_format . PHP'ye aşina iseniz, tam olarak aynı şekilde çalışır .

JavaScript kullanabilirsiniz. kod aşağıdadır, yalnızca acceptsayısal ve birdot

işte 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)" />

DEMO JSFIDDLE

Yapmanız gereken tek şey sadece gerçekten bu :

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

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>

Reaksiyon için çözümlerin kombinasyonu

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

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

handleOnChangeMonthlySalary(1000)```

Ngx-format-alanını kullanabilirsiniz. Görünümde görünecek giriş değerini biçimlendirmek için bir direktiftir. Arka uca kaydedilecek Giriş değerini değiştirmeyecektir. Buradaki bağlantıya bakın !

Misal:

component.html:

<input type="text" formControlName="currency" [appFormatFields]="CURRENCY"
(change)="onChangeCurrency()">

component.ts

onChangeCurrency() {
this.currency.patchValue(this.currency.value);
}

Demoyu görmek için: burada !

Aşağıdaki işlevi kullanabilirsiniz:

function format(number, decimals = 2, decimalSeparator = '.', thousandsSeparator = ',') {
  const roundedNumber = number.toFixed(decimals);
  let integerPart = '',
    fractionalPart = '';
  if (decimals == 0) {
    integerPart = roundedNumber;
    decimalSeparator = '';
  } else {
    let numberParts = roundedNumber.split('.');
    integerPart = numberParts[0];
    fractionalPart = numberParts[1];
  }
  integerPart = integerPart.replace(/(\d)(?=(\d{3})+(?!\d))/g, `$1${thousandsSeparator}`);
  return `${integerPart}${decimalSeparator}${fractionalPart}`;
}

// Use Example

let min = 1556454.0001;
let max = 15556982.9999;

console.time('number format');
for (let i = 0; i < 15; i++) {
  let randomNumber = Math.random() * (max - min) + min;
  let formated = format(randomNumber, 4, ',', '.'); // formated number

  console.log('number: ', randomNumber, '; formated: ', formated);
}
console.timeEnd('number format');

Buradaki cevapların hiçbirini beğenmedim, bu yüzden benim için çalışan bir fonksiyon yarattım. Başkasının yararlı bulması durumunda paylaşmak istiyorum.

function getFormattedCurrency(num) {
    num = num.toFixed(2)
    var cents = (num - Math.floor(num)).toFixed(2);
    return Math.floor(num).toLocaleString() + '.' + cents.split('.')[1];
}