Pad a number with leading zeros in JavaScript [duplicate]

Question

In JavaScript, I need to have padding.

For example, if I have the number 9, it will be "0009". If I have a number of say 10, it will be "0010". Notice how it will always contain four digits.

One way to do this would be to subtract the number minus 4 to get the number of 0s I need to put.

Is there was a slicker way of doing this?

Answer 1

ES2017 Update

You can use the built-in String.prototype.padStart()

n = 9; String(n).padStart(4, '0'); // '0009'  n = 10; String(n).padStart(4, '0'); // '0010' 

---

Not a lot of "slick" going on so far:

function pad(n, width, z) {   z = z || '0';   n = n + '';   return n.length >= width ? n : new Array(width - n.length + 1).join(z) + n; } 

When you initialize an array with a number, it creates an array with the length set to that value so that the array appears to contain that many undefined elements. Though some Array instance methods skip array elements without values, .join() doesn't, or at least not completely; it treats them as if their value is the empty string. Thus you get a copy of the zero character (or whatever "z" is) between each of the array elements; that's why there's a + 1 in there.

Example usage:

pad(10, 4);      // 0010 pad(9, 4);       // 0009 pad(123, 4);     // 0123  pad(10, 4, '-'); // --10 

Answer 2

function padToFour(number) {   if (number<=9999) { number = ("000"+number).slice(-4); }   return number; } 

Something like that?

Bonus incomprehensible-but-slicker single-line ES6 version:

let padToFour = number => number <= 9999 ? `000${number}`.slice(-4) : number; 

ES6isms:

• let is a block scoped variable (as opposed to var’s functional scoping)
• => is an arrow function that among other things replaces function and is prepended by its parameters
• If a arrow function takes a single parameter you can omit the parentheses (hence number =>)
• If an arrow function body has a single line that starts with return you can omit the braces and the return keyword and simply use the expression
• To get the function body down to a single line I cheated and used a ternary expression