Parse a String with Commas to a Number in JavaScript

# Parse a String with Commas to a Number using String.replaceAll()

To parse a string with commas to a number:

1. Use the replaceAll() method to remove all the commas from the string.
2. The replaceAll method will return a new string containing no commas.
3. Use the parseFloat() function to convert the string to a number.

Copied!
const str = '12,000,000.50';

const num = parseFloat(str.replaceAll(',', ''));

console.log(num); // 👉️ 123000000.5

The String.replaceAll() method returns a new string with all matches of a pattern replaced by the provided replacement.

The method takes the following parameters:

The String.replaceAll() method returns a new string with the matches of the pattern replaced. The method doesn't change the original string.

Strings are immutable in JavaScript.

The last step is to call the parseFloat() function with the result.

The parseFloat function parses the provided string and returns a floating-point number.

If the parseFloat() function cannot convert the string to a number, because the string contains non-numeric characters, the method returns NaN (not a number).

Here are some examples of using the parseFloat() function.

Copied!
console.log(parseFloat('100')); // 👉️ 100
console.log(parseFloat('100abc')); // 👉️ 100
console.log(parseFloat('100.5')); // 👉️ 100.5
console.log(parseFloat(10.5)); // 👉️ 10.5
console.log(parseFloat('a123')); //👉️ NaN

If you have to do this often, define a reusable function.

Copied!
function parseToNumber(str) {
  return parseFloat(str.replaceAll(',', ''));
}

console.log(parseToNumber('12,000,000.50')); // 👉️ 12000000.5
console.log(parseToNumber('12,123,456')); // 👉️ 12123456

The function takes a string with commas as thousands separator and parses the string to a number.

# Parse a String with Commas to a Number using String.split()

This is a three-step process:

1. Use the split() method to split the string on each comma.
2. Use the join() method to join the array into a string.
3. Use the parseFloat() function to convert the string to a number.

Copied!
function parseToNumber(str) {
  return parseFloat(str.split(',').join(''));
}

console.log(parseToNumber('12,000,000.50')); // 👉️ 12000000.5
console.log(parseToNumber('12,123,456')); // 👉️ 12123456

The String.split() method takes a separator and splits the string into an array on each occurrence of the provided delimiter.

Copied!
const str = '12,000,000.50';

// 👇️ [ '12', '000', '000.50' ]
console.log(str.split(','));

The String.split() method takes the following 2 parameters:

We split the string on each comma and joined the array without a separator.

The Array.join() method concatenates all of the elements in an array using a separator.

The only argument the Array.join() method takes is a separator - the string used to separate the elements of the array.

Copied!
const str = '12,000,000.50';

// 👇️ 12000000.50
console.log(str.split(',').join(''));

The last step is to pass the result to the parseFloat() function to convert the string to a number.

# Parse a String with Commas to a Number using String.replace()

This is a three-step process:

1. Use the replace() method to remove all the commas from the string.
2. The replace method will return a new string containing no commas.
3. Convert the string to a number.

Copied!
const str = '12,000,000.50';

const num = parseFloat(str.replace(/,/g, ''));

console.log(num); // 👉️ 123000000.5

We used the replace() method to remove all of the commas from the string.

The String.replace() method returns a new string with one, some, or all matches of a regular expression replaced with the provided replacement.

The method takes the following parameters:

The forward slashes / / mark the beginning and end of the regular expression.

We only match a comma in the regular expression.

Copied!
const str = '12,000,000.50';

const num = parseFloat(str.replace(/,/g, ''));

console.log(num); // 👉️ 123000000.5

The g (global) flag is used to match all occurrences of a comma in the string and not just the first occurrence.

We used an empty string for the replacement for each match to remove all commas from the string.

The last step is to use the parseFloat() function to convert the string to a number.

Which approach you pick is a matter of personal preference. I'd use the String.replaceAll() method as I find it quite direct and intuitive.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

• How to add Strings as Numbers in JavaScript
• Check if a String contains Numbers in JavaScript
• Check if String contains only Letters and Numbers in JS
• Check if String Starts with or Ends with Number in JS
• Convert Array of Strings to Array of Numbers in JavaScript
• How to Extract a Number from a String in JavaScript