Định dạng chuỗi / dấu phân tách hàng nghìn Javascript [trùng lặp]

Có chức năng nào trong Javascript để định dạng số và chuỗi không?

Tôi đang tìm cách cho dấu phân tách hàng nghìn cho chuỗi hoặc số ... (Giống như String.Format Trong c #)

Cập nhật (7 năm sau)

Tham chiếu được trích dẫn trong câu trả lời gốc dưới đây là sai. Có được tích hợp sẵn chức năng cho điều này, đó là chính xác những gì kaiser gợi ý dưới đây:toLocaleString

Vì vậy, bạn có thể làm:

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

Hàm được triển khai bên dưới cũng hoạt động, nhưng đơn giản là không cần thiết.

(Tôi nghĩ có lẽ mình sẽ gặp may và phát hiện ra rằng điều đó là cần thiết vào năm 2010, nhưng không. Theo tài liệu tham khảo đáng tin cậy hơn này , toLocaleString đã là một phần của tiêu chuẩn kể từ ECMAScript 3 Edition [1999], mà tôi tin rằng nó có nghĩa sẽ được hỗ trợ từ xa như IE 5.5.)

Câu trả lời gốc

Theo tài liệu tham khảo này, không có chức năng tích hợp để thêm dấu phẩy vào một số. Nhưng trang đó bao gồm một ví dụ về cách tự viết mã:

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

Chỉnh sửa: Để đi theo cách khác (chuyển đổi chuỗi có dấu phẩy thành số), bạn có thể làm như sau:

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

Nếu là về bản địa hóa hàng nghìn dấu phân cách, dấu phân cách và dấu phân cách thập phân, hãy làm như sau:

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

Có một số tùy chọn bạn có thể sử dụng (và thậm chí cả những ngôn ngữ có dự phòng):

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>

Thông tin chi tiết trên trang thông tin MDN .

Chỉnh sửa: Người bình luận @ Tôi thích Serena thêm những điều sau:

Để hỗ trợ các trình duyệt có ngôn ngữ không phải tiếng Anh mà chúng tôi vẫn muốn định dạng tiếng Anh, hãy sử dụng value.toLocaleString('en'). Cũng hoạt động cho dấu chấm động.

Đã cập nhật bằng cách sử dụng hỗ trợ nhìn lại phía sau phù hợp với các thay đổi của ECMAScript2018.
Để có khả năng tương thích ngược, hãy cuộn xuống sâu hơn để xem giải pháp ban đầu.

Một biểu thức chính quy có thể được sử dụng - đặc biệt hữu ích trong việc xử lý các số lớn được lưu trữ dưới dạng chuỗi.

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

»Giải thích chi tiết về regex (regex101.com)

Câu trả lời gốc này có thể không được yêu cầu nhưng có thể được sử dụng để tương thích ngược.

Cố gắng xử lý điều này bằng một biểu thức chính quy (không gọi lại) khả năng hiện tại của tôi không thành công vì thiếu cái nhìn tiêu cực trong Javascript ... không bao giờ kém đây là một giải pháp thay thế ngắn gọn khác hoạt động trong hầu hết các trường hợp chung - tính cho bất kỳ dấu thập phân nào bằng cách bỏ qua các trận đấu mà chỉ số của trận đấu xuất hiện sau chỉ số của một khoảng thời gian.

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

»Giải thích chi tiết về regex (regex101.com)

Có một plugin số jQuery rất hay: https://github.com/teamdf/jquery-number

Nó cho phép bạn thay đổi bất kỳ số nào ở định dạng bạn thích, với các tùy chọn cho chữ số thập phân và ký tự phân tách cho phần thập phân và phần nghìn:

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

Bạn có thể sử dụng nó trực tiếp bên trong các trường nhập liệu, đẹp hơn bằng cách sử dụng các tùy chọn tương tự như trên:

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

Hoặc bạn có thể áp dụng cho toàn bộ tập hợp các phần tử DOM bằng bộ chọn:

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

Tôi sử dụng cái này:

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

nguồn: liên kết

// 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());

để tham khảo, bạn có thể kiểm tra tại đây https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString

Bạn có thể sử dụng javascript. dưới đây là mã, nó sẽ chỉ là acceptsố và mộtdot

đây là 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

PHP.js có một hàm để thực hiện việc này được gọi là number_format . Nếu bạn đã quen với PHP, nó hoạt động giống hệt như vậy .

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>

Tất cả bạn cần làm chỉ thực sự là này :

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

Sự kết hợp của các giải pháp cho phản ứng

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

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

handleOnChangeMonthlySalary(1000)```

Bạn có thể sử dụng ngx-format-field. Nó là một chỉ thị để định dạng giá trị đầu vào sẽ xuất hiện trong dạng xem. Nó sẽ không thao tác giá trị Đầu vào sẽ được lưu trong chương trình phụ trợ. Xem link tại đây !

Thí dụ:

component.html:

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

component.ts

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

Để xem bản demo: tại đây !

Bạn có thể sử dụng chức năng sau:

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

Tôi không thích bất kỳ câu trả lời nào ở đây, vì vậy tôi đã tạo một hàm phù hợp với mình. Chỉ muốn chia sẻ trong trường hợp có ai khác thấy hữu ích.

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