How to Remove Commas From String in JavaScript
-
Remove Commas With the
replace()Method in JavaScript -
Remove Commas With the
split()Method in JavaScript -
Remove Commas With the Lodash
ReplaceMethod
This tutorial will explain how to remove commas from a string using the replace() and split() methods. After that, we’ll convert the strings to floats using parseFloat(), resulting in combined strings that will not concatenate during mathematical addition.
Remove Commas With the replace() Method in JavaScript
The replace() method accepts a regular expression pattern and a replacement string. It’ll use the regular expression pattern to find the commas in the string, replacing the commas with the replacement string.
We aim to eliminate the commas to empty the replacement string.
let string_one = '2,526.23';
let string_two = '33,999.21';
let replaced_string_one = string_one.replace(/,/g, '');
let replaced_string_two = string_two.replace(/,/g, '');
let add_replaced_string =
parseFloat(replaced_string_one) + parseFloat(replaced_string_two);
console.log('Replaced string_one: ', replaced_string_one);
console.log('Replaced string_two: ', replaced_string_two);
console.log('Added replaced string: ', add_replaced_string);
Output:
Replaced string_one: 2526.23
Replaced string_two: 33999.21
Added replaced string: 36525.44
In the above code, we have two strings saved in two variables. We want to add the numbers in the string, so we replace the commas with the replace() method.
After the replacement, we convert the string to a float using the parseFloat() function to preserve any decimal point in the string.
Remove Commas With the split() Method in JavaScript
The split method will take the comma in the string as a parameter, and it’ll return an array. This array contains elements that are chunks of the strings at each point where the split found a comma.
However, we need a string, not an array. We’ll convert the array to a string with the join() method.
Once the array elements are a string, you can use the parseFloat() function on it before adding them.
let first_string = '12,222,526.99';
let second_string = '2,821.21';
let replaced_first_string = first_string.split(',').join('');
let replaced_second_string = second_string.split(',').join('');
let add_replaced_string =
parseFloat(replaced_first_string) + parseFloat(replaced_second_string);
console.log('Replaced first_string: ', replaced_first_string);
console.log('Replaced second_string: ', replaced_second_string);
console.log('Added replaced string: ', add_replaced_string);
Output:
Replaced first_string: 12222526.99
Replaced second_string: 2821.21
Added replaced string: 12225348.200000001
Remove Commas With the Lodash Replace Method
Lodash is a JavaScript library; it has a replace() method that takes three arguments. These arguments are string, pattern, and replacement.
The string should contain what you’d like to replace, and the pattern should match the part of the string you’d like to replace. Finally, the replacement gets substituted into the string based on the pattern.
In the following code, we’ve used the Lodash replace() method to replace the commas in the strings. Afterward, we use the parseFloat() function on the resulting strings before adding them.
<body>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js"
integrity="sha512-WFN04846sdKMIP5LKNphMaWzU7YpMyCU245etK3g/2ARYbPK9Ub18eG+ljU96qKRCWh+quCY7yefSmlkQw1ANQ==" crossorigin="anonymous"
referrerpolicy="no-referrer"
>
</script>
<script type="text/javascript">
let lodash = _;
let string_one = '44,321.12';
let string_two = '1,245.01';
let replaced_string_one = _.replace(string_one, ',', '');
let replaced_string_two = _.replace(string_two, ',', '');
let add_replaced_string = parseFloat(replaced_string_one) + parseFloat(replaced_string_two);
console.log("Replaced string_one: ", replaced_string_one);
console.log("Replaced string_two: ", replaced_string_two);
console.log("Added replaced string: ", add_replaced_string);
</script>
</body>
Output:
Replaced string_one: 44321.12
Replaced string_two: 1245.01
Added replaced string: 45566.130000000005
Habdul Hazeez is a technical writer with amazing research skills. He can connect the dots, and make sense of data that are scattered across different media.
LinkedIn