How to Add Leading Zero to a Number in JavaScript

In JavaScript, there may be scenarios where you need to add a leading zero to a number if it is less than 10. This can be particularly useful when displaying time values, such as minutes and seconds. For example, instead of displaying “9” for a video duration of 9 minutes and 4 seconds, it would be more logical to display “09:04”.

To accomplish this, you can follow these steps:

First, make sure you have the number stored in a variable, let’s call it mynumber.
Use the Math.floor() function to round down the number to its nearest integer. This step is optional if your number is already an integer.
Convert the number to a string using the toString() method.
Utilize the padStart() method, which is a built-in function in JavaScript. This method allows you to add a specified character (in this case, ‘0’) to the beginning of a string until it reaches a desired length.

Here’s the code snippet that demonstrates how to add a leading zero to a number:

1
2
3

Math.floor(mynumber)
  .toString()
  .padStart(2, '0');

In the example above, mynumber represents the number to which you want to add a leading zero. The padStart() method ensures that the resulting string is always two characters long by adding a ‘0’ if necessary.

It’s worth noting that this solution is entirely based on JavaScript’s native functionality and does not require any additional libraries.

Tags: JavaScript, leading zero, number formatting