regex format string number with commas and 2 decimals in javascript

Question

I have a string n which is a number. The following adds the commas where needed, but I also want to change the number of decimals. It should also round where appropriate.

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

This turns a number like 1234.567 in to 1,234.567. But I need my number to look like: 1,234.57

I tried taking parts[1] and converting to a Number, then rounding, then concatenating it back; but that is error prone.

How can I get this result by altering my regex? Thanks.

Rob M. · Accepted Answer · 2019-09-18 21:51:50Z

47

Edit: Sept 18, 2019

Since new APIs are available, thought it would be helpful to point out that you can do this much more simply using toLocaleString options:

const numbers = [1, 1000, 2345.67, 21589.334719999995];
const options = { 
  minimumFractionDigits: 2,
  maximumFractionDigits: 2 
};
numbers.forEach(num => {
  const formatted = Number(num).toLocaleString('en', options);
  console.log(formatted);
});

original answer

To add the commas, you could use:

n = parseFloat(n).toFixed(2)
var withCommas = Number(n).toLocaleString('en');

Here is a fiddle

edited Sep 18, 2019 at 21:51

answered Aug 4, 2014 at 20:51

Rob M.

36.6k6 gold badges56 silver badges51 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Stephen P Over a year ago

I collapsed the whole thing to Number(parseFloat(n).toFixed(2)).toLocaleString('en');

QWERTY Over a year ago

@RobM. But I tested with 123949.1, it does not return me with 2 decimal point. Is there any workaround for it?

daCoda Over a year ago

I tested with n=1. Returns 1, expected 1.00 (does not work :'( )

Rob M. Over a year ago

@daCoda Right, you would need to use the maximumFractionDigits option for that

daCoda Over a year ago

This: Number(n).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 }). Thanks!

|

brno792 · Accepted Answer · 2014-08-04 21:21:25Z

8

var val = Math.round(Number(n) *100) / 100;
var parts = val.toString().split(".");
var num = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",") + (parts[1] ? "." + parts[1] : "");

answered Aug 4, 2014 at 21:21

brno792

6,82918 gold badges58 silver badges72 bronze badges

Comments

adeneo · Accepted Answer · 2014-08-04 20:35:31Z

3

You could just use toFixed

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

FIDDLE

That would also make 1234.0000 to 1234.00, but you can avoid that by converting to a number in the ternary, as zero is falsy

answered Aug 4, 2014 at 20:35

adeneo

319k29 gold badges410 silver badges392 bronze badges

4 Comments

brno792 Over a year ago

n is a string, so I cant use toFixed(). n needs to stay a string for other reasons.

adeneo Over a year ago

@brno792 - I'm sorry to break it to you, but you can't round a string, no matter how hard you try.

adeneo Over a year ago

You could of course just slice of the end of the string with parts[1].slice(0,2), but that would give you 1234.56 as it doesn't round.

brno792 Over a year ago

Yes, I am well aware of that.. your solution is no help though.

Amil Sajeev · Accepted Answer · 2017-05-12 08:32:18Z

1

i think this is useful

var n=1234.567
var parts = n.toFixed(2).split(".");
var num = parts[0].replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,") + 
    (parts[1] ? "." + parts[1] : "");
console.log(num);

if you want result 1,234.567 then change toFixed(2) to toFixed(3)

answered May 12, 2017 at 8:32

Amil Sajeev

2702 silver badges10 bronze badges

Comments

Bishnu Paudel · Accepted Answer · 2019-05-03 00:29:03Z

1

var valueString="1500"; //can be 1500.0 or 1500.00 
var amount=parseFloat(valueString).toFixed(2);
var formattedString= amount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
console.log(formattedString); //outputs 1,500.00

answered May 3, 2019 at 0:29

Bishnu Paudel

2,0891 gold badge22 silver badges39 bronze badges

1 Comment

ggorlen Over a year ago

Thanks for your answer. Typically, it's helpful to write a few remarks outside of the code block that explains how the code works for future readers.

Ken Gregory · Accepted Answer · 2017-10-21 16:56:11Z

0

When it comes to formatting currency in JavaScript, toLocaleString is great. You don't need to combine it with toFixed and it will not work in some cases (whole numbers, numbers with single-digit fractions). Here's an example function:

const formatCurrency = (num, locale = 'en-US', currency = 'USD', minimumFractionDigits = 2) => {
    if (isNaN(num)) {
        return num;
    }
  return num.toLocaleString(locale, {style: 'currency', currency, minimumFractionDigits});
};

No super-customized string format patterns and no chained methods that work in specific scenarios.

Here is an example fiddle

answered Oct 21, 2017 at 16:56

Ken Gregory

7,4201 gold badge42 silver badges46 bronze badges

Comments

koneri ranjith kumar · Accepted Answer · 2019-01-18 06:06:43Z

0

To avoid that by converting to a number in the ternary, as zero is falsy

n = parseFloat(n).toFixed(2)
var withCommas = Number(n).toLocaleString('en');
withCommas = (withCommas.indexOf(".")== -1) ? `${withCommas}.00` : withCommas;

answered Jan 18, 2019 at 6:06

koneri ranjith kumar

5481 gold badge7 silver badges15 bronze badges

Comments

daCoda · Accepted Answer · 2019-09-18 21:49:15Z

0

Adding onto @Rob M's answer (for a minimum AND maximum of 2dp):

function getMe2DecimalPointsWithCommas(amount) {
    return Number(amount).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
}

answered Sep 18, 2019 at 21:49

daCoda

3,9355 gold badges37 silver badges40 bronze badges

Comments

Urja Satodiya · Accepted Answer · 2022-05-09 12:20:57Z

0

I think this is the easy way to format the Number with different Locale

const NumberFormatter = (value, decimal) => {
  return parseFloat(parseFloat(value).toFixed(decimal)).toLocaleString(
    "en-IN",
    {
      useGrouping: true,
    }
  );};

Instead of "en-IN" you can specify Language. like ‘ja-JP’,’en-US’ and ‘de-DE’, etc. It will group the number with the symbol based on the locale.

Ref: Format Numbers

answered May 9, 2022 at 12:20

Urja Satodiya

4125 silver badges11 bronze badges

Collectives™ on Stack Overflow

regex format string number with commas and 2 decimals in javascript

9 Answers 9

6 Comments

Comments

4 Comments

Comments

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

9 Answers 9

6 Comments

Comments

4 Comments

Comments

1 Comment

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related