How to remove leading zeros from a number in JavaScript?

Javascript Web Development Front End Technology

In this tutorial, we will explore how we can remove leading zeroes from any number in JavaScript. JavaScript removes leading zeroes from an integer variable automatically, but this is not the case when we consider strings in JavaScript. It is possible that a string in JavaScript which represents a numerical value may contain leading zeroes.

These leading zeroes may cause problems when we try to perform any operation on the numerical value the string represents. This is why we will explore the ways by which we can remove the leading zeroes from a number, expressed as a string in JavaScript.

Using the parseInt() method in JavaScript

One of the easiest ways to remove leading zeroes from a number represented as a string in JavaScript is by using the parseInt() method. But how? First, let us take a look at what this function basically does.

The parseInt() function in JavaScript basically takes a string of numerical characters as input and converts it into an integer. Basically, this method returns the numerical value represented by a string which is passed to it as input in the form of an integer in JavaScript.

Now as we previously discussed, a valid integer in JavaScript does not have leading zeroes, if we parse a string using the parseInt() method in JavaScript and convert it into an integer, it will not have any leading zeroes, thus solving our problem. Hence, we can pass our string with leading zeroes as an input to the parseInt() function and get the number without any leading zeroes.

Let us now take a look at the syntax and parameters of the parseInt() function in JavaScript.

Syntax and Parameters

The syntax of the parseInt() function is −

parseInt(s , r);

Let us take a look at both parameters in detail.

s − This represents the string that is to be converted into an integer. This is a required parameter.
r − This is an optional parameter, and it denotes the radix or base of the numerical value of the string. If a value is not provided, the radix is assumed based on the string passed as input.

Even though the second parameter is optional, it doesn't always default to 10, and hence it is better if we pass a radix along with the string so that it is parsed correctly.

Example

In the below example, we use parseInt() method to remove the leading zeros from a number (00378).


<!DOCTYPE html>
<html>
<body>
   <script>
      var num = "00378";
      document.write("Original number was : " + num);

      var int_num = parseInt(num,10);
      document.write("<br>Parsed number is : " + int_num);
   </script>
</body>
</html>

In the above example code, the string num initially had leading zeroes. To remove these zeroes we passed the string as the input to the parseInt() function along with radix = 10 as the string represents a decimal number. When we output the final value, the leading zeroes are removed from the value of the number.

Using the string replace() method in JavaScript

JavaScript strings have a method called replace(), to which we can pass two strings -pattern and replacement, and the method will replace all occurrences of pattern with the replacement provided. To be precise, using this method we can replace all occurrences of a particular pattern in a string with whatever we want. Hence, by using this method we can replace the leading zeroes in our string with an empty string, thus removing them.

Let us look at the syntax and parameters of the replace() method in JavaScript.

Syntax and Parameters

The syntax of the replace function is −

s.replace(pattern, replacement);

Here s is the string in which we want to replace some pattern. Let us look at both the parameters in detail −

pattern − This refers to the substring of the string s which is to be converted into something else, the substring that is to be replaced. This parameter can’t only be a string but can also be a regular expression that denotes the pattern to be found and replaced in string s. Only the first occurrence of the pattern in s will be replaced, but if a regular expression is provided with the global modifier ‘g’ in this parameter, all matches of that regular expression in the string s will be replaced. Naturally, this is a required parameter.
replacement − This denotes the string which will take the place of the pattern in the string s. This is what every occurrence of the pattern will be replaced with. Note that this parameter can also be a function that returns the string which will be used as a replacement for each occurrence of pattern in s.

Example

In the following example code, we have used both the methods, the string way as well as the regular expression way to remove leading zeroes. The regular expression /^0+/ denotes all the zeroes at the start of the string followed by any number of characters.


<!DOCTYPE html>
<html>
<body>
   <script>
      var num = "00378";
      document.write("Original number was : " + num);

      var replaced_num = num.replace("00","");
      document.write("<br>Replaced number is : " + replaced_num);

      var regex_num = num.replace(/^0+/,"");
      document.write("<br>Regex replaced number is : " + replaced_num);
   </script>
</body>
</html>

Conclusion

In this tutorial, we saw how we can remove leading zeroes from a string in JavaScript using two inbuilt JavaScript functions. These are −

The parseInt() method in JavaScript, which converts a string into a number so the leading zeroes are removed.
The string.replace() method in JavaScript, which is used to replace a pattern in any string, so we can replace leading zeroes with empty space.

Prabhdeep Singh

Updated on: 07-Nov-2022

18K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started