如何在JavaScript中输出带有前导零的数字？

Question

有没有一种方法可以在数字前添加前导零，使其成为固定长度的字符串？例如，如果我指定了2个位置，5就会变成"05"。

- chris

---

我发现这个网页，我觉得这个方法更简单：("00" + h).slice (-3);。 - Paulo Bueno

@PauloBueno зҡ„д»Јз Ғ ("00" + 1234).slice(-3); зҡ„иҫ“еҮәз»“жһңдёә 234пјҢеҚіиҲҚеҺ»дәҶжңҖй«ҳдҪҚж•°еӯ—гҖӮ - Daniel Earwicker

@DanielEarwicker 当然可以，但你需要根据你期望的数字位数进行调整。例如("000" + 1234).slice(-4)，("0000" + 12345).slice(-5)等等。 - Paulo Bueno

如果您还想限制数字长度，可以使用以下代码：return (num/Math.pow(10,size)).toFixed(size).split('.')[1];。 - loafer

现在 JavaScript 支持 padStart 方法：(5).toString().padStart(3, "0")。该方法的作用是在字符串前面添加指定数量的填充字符，使其达到指定的长度。 - fdelia

Answer 1

注意：可能已过时。ECMAScript 2017 包含了 String.prototype.padStart。

由于数字不能与前导零一起使用，所以您必须将数字转换为字符串。可以像这样进行操作：

function pad(num, size) {
    num = num.toString();
    while (num.length < size) num = "0" + num;
    return num;
}

或者，如果您知道您永远不会使用超过X个零，那么这可能更好。这假设您永远不需要超过10位数字。

function pad(num, size) {
    var s = "000000000" + num;
    return s.substr(s.length-size);
}

如果您关心负数，您需要去掉 - 并读取它。

- InfinitiesLoop

---

第二个函数；更简洁版： return num.toString().padStart(size,'0'); }``` - Blaise

许多版本的IE不支持负值。 - InfinitiesLoop

啊，显然在IE中使用slice()可以处理负数值 :) https://dev59.com/pnE95IYBdhLWcg3wlu-z - InfinitiesLoop

解决了：value = pad(value, 18); ==> 总是返回18个字符，所以如果你添加10个零，大小应该为10。 - Enrico

另一个选项是通过区域设置将数字转换为字符串，并指定最小整数位数 num.toLocaleString(undefined, { minimumIntegerDigits: size })。https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString - Jon z

Answer 2

更新：使用ES2017的String.prototype.padStart方法编写的小型单行函数:

const zeroPad = (num, places) => String(num).padStart(places, '0')

console.log(zeroPad(5, 2)); // "05"
console.log(zeroPad(5, 4)); // "0005"
console.log(zeroPad(5, 6)); // "000005"
console.log(zeroPad(1234, 2)); // "1234"

另一种 ES5 的方法：

function zeroPad(num, places) {
  var zero = places - num.toString().length + 1;
  return Array(+(zero > 0 && zero)).join("0") + num;
}

zeroPad(5, 2); // "05"
zeroPad(5, 4); // "0005"
zeroPad(5, 6); // "000005"
zeroPad(1234, 2); // "1234" :)

- Christian C. Salvadó

---

你没有考虑到负数数组大小 ;) 例如 zeroPad(1234, 2) -> RangeError: Invalid array length - Crescent Fresh

根据这个基准测试，这种方法比已被接受的解决方案慢5倍：https://gist.github.com/4382935 - andrewrk

我喜欢这段代码，但在Chrome中似乎比较慢。有兴趣看看其他浏览器的结果：http://jsperf.com/zero-padding-number-methods - Michelle Tilley

对于Node.js来说，这是最好的工作解决方案。GJ - Matthis Kohli

如果你和我一样慢，那么在 .padStart 调用中的 num 参数并不是要填充的长度，而是要填充到的最大长度。这是一个重要的区别。 - fIwJlxSzApHEZIl

zeroPad(1.2, 5) -> '001.2' - Arel

Answer 3

您可以扩展Number对象：

Number.prototype.pad = function(size) {
    var s = String(this);
    while (s.length < (size || 2)) {s = "0" + s;}
    return s;
}

例子：

(9).pad();  //returns "09"

(7).pad(3);  //returns "007"

- Mild Fuzz

---

我认为这正是我所需要的。参数“size”指的是最终字符计数，而不是要添加的零的总数，对吗？ - novwhisky

是的，它会检查总长度并进行比较。 - Mild Fuzz

(9).pad() 和 (7).pad(3) 带括号！ - trusktr

@Adam，你看到文章的日期了吗？所以这在IE6中表现不佳，:scream:！谢谢Mild。 - Luis Lopes

这个问题与全局变量不可比，并且与IE6没有任何关系。这个问题是永久性的，它已经被发现多年了，但并没有消失。问题在于语言本身的演变。如果原生版本出现，谁又能保证你的.pad()会以相同的方式工作呢？我找不到我的原始评论。希望这只是Stack Overflow的一个错误。如果它被删除了，那将反映这里的状况很糟糕。 - Adam

Answer 4

来自 https://gist.github.com/1180489

function pad(a, b){
  return(1e15 + a + '').slice(-b);
}

带有注释：

function pad(
  a, // the number to convert 
  b // number of resulting characters
){
  return (
    1e15 + a + // combine with large number
    "" // convert to string
  ).slice(-b) // cut leading "1"
}

- dave1010

---

这个东西很不错，但有一个致命的缺陷。例如，pad (1234, 3) === "234"！这显然是不可接受的。 - Brock Adams

如果您需要超过15个字符的填充，它也会出现问题。虽然优雅，但相当僵硬。 - Mild Fuzz

@dave1010 我得到了一个糟糕的结果，pad(1234) 返回 "1000000000001234"。而使用参数 pad(1234,20) 则返回 "1000000000001234"。感谢 @Brock Adams。 - JamesThomasMoon

@JamesThomasMoon1979，请查看此答案。它不仅可以正常工作（而大多数其他答案无法通过许多测试用例），而且在性能方面明显优于其他方法 - 特别是如果您使用评论中链接的对数变化。 - Brock Adams

@BrockAdams 我的测试用例在之前的评论中。它没有正常工作。在Ubuntu上使用Firefox 35进行了测试。 - JamesThomasMoon

Answer 5

function zfill(num, len) {return (Array(len).join("0") + num).slice(-len);}

- ithinc

---

当您发布代码时，请选择它并单击“{}”按钮，以使其格式化为此格式。 - Shef

zfill(1234, 3) === "234" 的翻译如下：在用0填充的情况下将数字1234格式化为长度为3的字符串，结果为"234"。 - Lukáš Rampa

函数zFill(n，l){return(l> n.toString().length)?((Array(l).join('0')+n).slice(-l)):n;} - Atul Gupta

Answer 6

仅供娱乐（我有些时间可以消磨），这是一个更为复杂的实现，它缓存了零字符串：

pad.zeros = new Array(5).join('0');
function pad(num, len) {
    var str = String(num),
        diff = len - str.length;
    if(diff <= 0) return str;
    if(diff > pad.zeros.length)
        pad.zeros = new Array(diff + 1).join('0');
    return pad.zeros.substr(0, diff) + str;
}

如果填充计数很大且该函数被足够频繁地调用，它实际上比其他方法更有效...

- Christoph