Pertanyaan Bagaimana saya bisa memformat angka sebagai string mata uang dolar di JavaScript?


Saya ingin memformat harga di JavaScript.
Saya ingin fungsi yang mengambil float sebagai argumen dan mengembalikan a string diformat seperti ini:

"$ 2,500.00"

Apa cara terbaik untuk melakukan ini?


1389


asal


Jawaban:


Kamu dapat memakai:

  var profits=2489.8237
  profits.toFixed(3) //returns 2489.824 (round up)
  profits.toFixed(2) //returns 2489.82
  profits.toFixed(7) //returns 2489.8237000 (padding)

Kemudian Anda dapat menambahkan tanda '$'.

Jika Anda membutuhkan ',' untuk seribu Anda dapat menggunakan:

Number.prototype.formatMoney = function(c, d, t){
    var n = this, 
    c = isNaN(c = Math.abs(c)) ? 2 : c, 
    d = d == undefined ? "." : d, 
    t = t == undefined ? "," : t, 
    s = n < 0 ? "-" : "", 
    i = String(parseInt(n = Math.abs(Number(n) || 0).toFixed(c))), 
    j = (j = i.length) > 3 ? j % 3 : 0;
   return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
 };

Dan gunakan dengan:

(123456789.12345).formatMoney(2, '.', ',');

Jika Anda selalu akan menggunakan '.' dan ',', Anda dapat meninggalkannya dari pemanggilan metode Anda, dan metode akan mengaturnya secara default untuk Anda.

(123456789.12345).formatMoney(2);

Jika budaya Anda memiliki dua simbol yang dibalik (yaitu orang Eropa), cukup tempelkan dua baris berikut di formatMoney metode:

    d = d == undefined ? "," : d, 
    t = t == undefined ? "." : t, 

1515



Solusi singkat dan cepat (bekerja di mana-mana!)

(12345.67).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,');  // 12,345.67

Ide dibalik solusi ini adalah mengganti bagian yang cocok dengan kecocokan dan koma pertama, yaitu '$&,'. Pencocokan dilakukan menggunakan pendekatan lookahead. Anda dapat membaca ekspresi sebagai "mencocokkan nomor jika diikuti oleh urutan tiga set angka (satu atau lebih) dan titik".

UJI:

1        --> "1.00"
12       --> "12.00"
123      --> "123.00"
1234     --> "1,234.00"
12345    --> "12,345.00"
123456   --> "123,456.00"
1234567  --> "1,234,567.00"
12345.67 --> "12,345.67"

DEMO:  http://jsfiddle.net/hAfMM/9571/


Solusi singkat yang diperluas

Anda juga dapat memperpanjang prototipe Number objek untuk menambahkan dukungan tambahan dari sejumlah desimal [0 .. n] dan ukuran kelompok nomor [0 .. x]:

/**
 * Number.prototype.format(n, x)
 * 
 * @param integer n: length of decimal
 * @param integer x: length of sections
 */
Number.prototype.format = function(n, x) {
    var re = '\\d(?=(\\d{' + (x || 3) + '})+' + (n > 0 ? '\\.' : '$') + ')';
    return this.toFixed(Math.max(0, ~~n)).replace(new RegExp(re, 'g'), '$&,');
};

1234..format();           // "1,234"
12345..format(2);         // "12,345.00"
123456.7.format(3, 2);    // "12,34,56.700"
123456.789.format(2, 4);  // "12,3456.79"

DEMO / TES:  http://jsfiddle.net/hAfMM/435/


Solusi singkat super diperpanjang

Di dalam versi super panjang Anda dapat mengatur jenis pembatas yang berbeda:

/**
 * Number.prototype.format(n, x, s, c)
 * 
 * @param integer n: length of decimal
 * @param integer x: length of whole part
 * @param mixed   s: sections delimiter
 * @param mixed   c: decimal delimiter
 */
Number.prototype.format = function(n, x, s, c) {
    var re = '\\d(?=(\\d{' + (x || 3) + '})+' + (n > 0 ? '\\D' : '$') + ')',
        num = this.toFixed(Math.max(0, ~~n));

    return (c ? num.replace('.', c) : num).replace(new RegExp(re, 'g'), '$&' + (s || ','));
};

12345678.9.format(2, 3, '.', ',');  // "12.345.678,90"
123456.789.format(4, 4, ' ', ':');  // "12 3456:7890"
12345678.9.format(0, 3, '-');       // "12-345-679"

DEMO / TES:  http://jsfiddle.net/hAfMM/612/


1014



Intl.numberformat

Javascript memiliki formatter nomor, dan itu adalah bagian dari Internationalation API.

// Create our number formatter.
var formatter = new Intl.NumberFormat('en-US', {
  style: 'currency',
  currency: 'USD',
  minimumFractionDigits: 2,
  // the default value for minimumFractionDigits depends on the currency
  // and is usually already 2
});

formatter.format(2500); /* $2,500.00 */

JS biola

Beberapa catatan tentang dukungan browser

  • Semua browser utama mendukungnya saat ini
  • Pelanggar terbesar dalam hal dukungan adalah UC Mobile (menjauh dari itu) dan Opera Mini (lumpuh oleh desain)
  • Ada sebuah shim untuk mendukungnya pada browser lama
  • Silahkan lihat CanIUse untuk info lebih lanjut

Intl.NumberFormat vs Number.prototype.toLocaleString

Catatan terakhir membandingkan ini dengan yang lebih tua.toLocaleString. Mereka berdua pada dasarnya menawarkan fungsi yang sama. Namun, toLocaleString dalam inkarnasinya yang lebih tua (pra-Intl) sebenarnya tidak mendukung lokal: itu menggunakan lokal sistem. Oleh karena itu, untuk memastikan bahwa Anda menggunakan versi yang benar, MDN menyarankan untuk memeriksa keberadaan Intl. Jadi, jika Anda perlu memeriksa Intl, mengapa tidak digunakan saya t sebagai gantinya? Namun, jika Anda memilih untuk menggunakan shim, itu juga tambalan toLocaleString, sehingga dalam hal ini Anda dapat menggunakannya tanpa repot:

(2500).toLocaleString('en-US', {
  style: 'currency',
  currency: 'USD',
}); /* $2,500.00 */

758



Lihatlah JavaScript Jumlah keberatan dan lihat apakah itu bisa membantu Anda.

  • toLocaleString() akan memformat angka menggunakan pemisah ribuan lokasi tertentu.
  • toFixed() akan membulatkan angka ke sejumlah tempat desimal tertentu.

Untuk menggunakan ini pada saat yang sama, nilainya harus berubah kembali ke angka karena keduanya mengeluarkan string.

Contoh:

Number(someNumber.toFixed(1)).toLocaleString()

160



Di bawah ini adalah Patrick Desjardins (alias Daok) kode dengan sedikit komentar yang ditambahkan dan beberapa perubahan kecil:

/* 
decimal_sep: character used as deciaml separtor, it defaults to '.' when omitted
thousands_sep: char used as thousands separator, it defaults to ',' when omitted
*/
Number.prototype.toMoney = function(decimals, decimal_sep, thousands_sep)
{ 
   var n = this,
   c = isNaN(decimals) ? 2 : Math.abs(decimals), //if decimal is zero we must take it, it means user does not want to show any decimal
   d = decimal_sep || '.', //if no decimal separator is passed we use the dot as default decimal separator (we MUST use a decimal separator)

   /*
   according to [https://stackoverflow.com/questions/411352/how-best-to-determine-if-an-argument-is-not-sent-to-the-javascript-function]
   the fastest way to check for not defined parameter is to use typeof value === 'undefined' 
   rather than doing value === undefined.
   */   
   t = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep, //if you don't want to use a thousands separator you can pass empty string as thousands_sep value

   sign = (n < 0) ? '-' : '',

   //extracting the absolute value of the integer part of the number and converting to string
   i = parseInt(n = Math.abs(n).toFixed(c)) + '', 

   j = ((j = i.length) > 3) ? j % 3 : 0; 
   return sign + (j ? i.substr(0, j) + t : '') + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : ''); 
}

dan di sini beberapa tes:

//some tests (do not forget parenthesis when using negative numbers and number with no decimals)
alert(123456789.67392.toMoney() + '\n' + 123456789.67392.toMoney(3) + '\n' + 123456789.67392.toMoney(0) + '\n' + (123456).toMoney() + '\n' + (123456).toMoney(0) + '\n' + 89.67392.toMoney() + '\n' + (89).toMoney());

//some tests (do not forget parenthesis when using negative numbers and number with no decimals)
alert((-123456789.67392).toMoney() + '\n' + (-123456789.67392).toMoney(-3));

Perubahan kecil adalah:

  1. pindah sedikit Math.abs(decimals) harus dilakukan hanya jika tidak NaN.

  2. decimal_sep tidak bisa menjadi string kosong lagi (semacam pemisah desimal adalah suatu KEHARUSAN)

  3. kita gunakan typeof thousands_sep === 'undefined' seperti yang disarankan di Cara terbaik untuk menentukan apakah argumen tidak dikirim ke fungsi JavaScript

  4. (+n || 0) tidak diperlukan karena this adalah Number obyek


157



accounting.js adalah pustaka JavaScript kecil untuk pemformatan angka, uang, dan mata uang.


120



Inilah formater uang js terbaik yang pernah saya lihat:

Number.prototype.formatMoney = function(decPlaces, thouSeparator, decSeparator) {
    var n = this,
        decPlaces = isNaN(decPlaces = Math.abs(decPlaces)) ? 2 : decPlaces,
        decSeparator = decSeparator == undefined ? "." : decSeparator,
        thouSeparator = thouSeparator == undefined ? "," : thouSeparator,
        sign = n < 0 ? "-" : "",
        i = parseInt(n = Math.abs(+n || 0).toFixed(decPlaces)) + "",
        j = (j = i.length) > 3 ? j % 3 : 0;
    return sign + (j ? i.substr(0, j) + thouSeparator : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thouSeparator) + (decPlaces ? decSeparator + Math.abs(n - i).toFixed(decPlaces).slice(2) : "");
};

Itu diformat ulang dan dipinjam dari sini: https://stackoverflow.com/a/149099/751484

Anda harus menyediakan penentu mata uang Anda sendiri (Anda menggunakan $ di atas).

Sebut saja seperti ini (meskipun perhatikan bahwa args default to 2, comma, & period, jadi Anda tidak perlu menyediakan argumen apa pun jika itu adalah preferensi Anda):

var myMoney=3543.75873;
var formattedMoney = '$' + myMoney.formatMoney(2,',','.'); // "$3,543.76"

95