Pad a number with leading zeros in JavaScript

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

User · Answer

You could do something like this   function pad   num  size       return   Math pow  10  size       num   toString   substring  1        Edit  This was just a basic idea for a function  but to add support for larger numbers  as well as invalid input   this would probably be better   function pad   num  size       if  num toString   length  gt   size  return num    return   Math pow  10  size     Math floor num    toString   substring  1        This does 2 things    If the number is larger than the specified size  it will simply return the number  Using Math floor num  in place of   num will support larger numbers

User · Answer

Since you mentioned it s always going to have a length of 4  I won t be doing any error checking to make this slick      function pad input        var BASE    0000       return input   BASE substr 0  4 - Math ceil input   10     input   BASE      Idea  Simply replace  0000  with number provided    Issue with that is  if input is 0  I need to hard-code it to return  0000   LOL   This should be slick enough   JSFiddler  http   jsfiddle net Up5Cr

User · Answer

function padToFour number      if  number lt  9999    number     000  number  slice -4       return number      Something like that   Bonus incomprehensible-but-slicker single-line ES6 version   let padToFour   number   gt  number  lt   9999    000  number   slice -4    number    ES6isms    let is a block scoped variable  as opposed to var   s functional scoping    gt  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   gt   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

User · Answer

You did say you had a number-  String prototype padZero  function len  c       var s      c  c     0   len   len    2 -this length      while s length lt len  s   c      return s this    Number prototype padZero  function len  c       return String this  padZero len c

User · Answer

For fun  instead of using a loop to create the extra zeros   function zeroPad n length     var s n    needed length-s length    if  needed gt 0  s  Math pow 10 needed      slice 1  s    return s

User · Answer

Try  String prototype lpad   function padString  length        var str   this      while  str length  lt  length          str   padString   str      return str     Now test  var str    quot 5 quot   alert str lpad  quot 0 quot   4      result  quot 0005 quot  var str    quot 10 quot      note this is string type alert str lpad  quot 0 quot   4      result  quot 0010 quot   DEMO  In ECMAScript 2017   we have new method padStart and  padEnd  which has below syntax    quot string quot  padStart targetLength   padString      So now we can use const str    quot 5 quot   str padStart 4   quot 0 quot        quot 0005 quot

User · Answer

Not a lot of  slick  going on so far   function pad n  width  z      z   z     0     n   n         return n length  gt   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

User · Answer

This is not really  slick  but it s faster to do integer operations than to do string concatenations for each padding 0   function ZeroPadNumber   nValue         if   nValue  lt  10                 return    000    nValue toString                 else if   nValue  lt  100                 return    00    nValue toString                 else if   nValue  lt  1000                 return    0    nValue toString                 else               return   nValue              This function is also hardcoded to your particular need  4 digit padding   so it s not generic

User · Answer

Funny  I recently had to do this   function padDigits number  digits        return Array Math max digits - String number  length   1  0   join 0    number      Use like   padDigits 9  4        0009  padDigits 10  4       0010  padDigits 15000  4       15000    Not beautiful  but effective

[javascript] Pad a number with leading zeros in JavaScript

Examples related to javascript

Examples related to formatting