【问题标题】:How to output numbers with leading zeros in JavaScript? [duplicate]如何在 JavaScript 中输出带有前导零的数字? [复制]
【发布时间】:2011-03-01 05:43:26
【问题描述】:

有没有办法在数字前面加上前导零,以便生成固定长度的字符串?例如,如果我指定 2 个地点,5 将变为 "05"。

【问题讨论】:

  • 我找到了this,我想这要简单得多:("00" + h).slice (-3);
  • @PauloBueno ("00" + 1234).slice (-3); 给出234 即丢弃最重要的数字。
  • @DanielEarwicker 确实可以,但您应该调整到您期望的数字数量。 ("000" + 1234).slice(-4)、("0000" + 12345).slice(-5) 等等……
  • 如果你还想限制数字的长度,你可以使用这个:return (num/Math.pow(10,size)).toFixed(size).split('.')[1];
  • 现在javascript支持padStart:(5).toString().padStart(3, "0")。

标签: javascript text-formatting number-formatting


【解决方案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);
}

如果您关心负数,则必须删除 - 并阅读它。

【讨论】:

  • 第二个功能;更短:function pad(num, size){ return ('000000000' + num).substr(-size); }
  • ^ 负值在许多版本的 IE 中都不起作用。
  • 啊,显然 slice() 可以在 IE 中使用负值 :) stackoverflow.com/questions/2243824/…
  • 也许是一个如何调用函数和结果的例子?
  • 想通了:value = pad(value, 18); ==> 总是返回 18 个字符,所以如果你添加 10 个零的大小应该是 10。
【解决方案2】:

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

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

使用 cmets:

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"
}

【讨论】:

  • 这很好,但它有一个致命的缺陷。例如,pad (1234, 3) === "234"!这显然是不可接受的。
  • 如果你想要超过 15 的填充,它也会被破坏。优雅,但相当不灵活。
  • @dave1010 我得到了一个不好的结果 pad(1234) 产生 "1000000000001234" 。带参数pad(1234,20) 产生"1000000000001234" 谢谢@Brock Adams
  • @JamesThomasMoon1979,见this answer。它不仅可以正常工作(而大多数其他答案在许多测试用例中都失败了),而且它的性能明显优于其他方法——尤其是如果您使用 cmets 中链接的对数变化。
  • 满足我的需要,我就是喜欢它。简单的。另一种看待事物的方式。不像每个人。想不同!以上所有方法也各有利弊。
【解决方案3】:

更新:使用 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" :)

【讨论】:

  • 您没有考虑负数组大小;)例如zeroPad(1234, 2) -> RangeError: Invalid array length
  • 根据这个基准,这个方法比公认的解决方案慢 5 倍:gist.github.com/4382935
  • 我喜欢这段代码,但它在 Chrome 中似乎速度较慢。有兴趣查看其他浏览器的结果:jsperf.com/zero-padding-number-methods
  • 对于 Node.js,这是最好的解决方案。 GJ
  • nodejs的最佳解决方案
【解决方案4】:

您可以扩展 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"

【讨论】:

  • 我认为这正是我所需要的。参数“大小”指的是最终字符数,而不是要添加的零的总数,对吧?
  • 是的,确实如此,它会检查总长度并进行比较。
  • 是的,这取决于您在哪里使用它。这本质上不是坏事,但如果在有大量第三方参与的空间中使用,则可能存在覆盖功能的风险。
  • (9).pad() 和 (7).pad(3) 带括号!
  • 这个问题不是全局的,也和IE6没有关系。问题是永久性的。它在几年前被发现的事实并没有让它消失。问题是语言本身在进化。谁说你的.pad() 会像原生版本一样工作,它应该出现吗?我找不到我原来的评论。希望这只是 Stack Overflow 中的一个错误。如果它被删除,那将是对周围事物状态的不良反映。
【解决方案5】:
function zfill(num, len) {return (Array(len).join("0") + num).slice(-len);}

【讨论】:

  • 当你发布代码时选择它并点击{}按钮,这样它就会被格式化。
  • zfill(1234, 3) === "234"
  • function zFill(n,l){return (l>n.toString().length)?((Array(l).join('0')+n).slice(-l )):n;}
【解决方案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;
}

如果填充计数很大并且该函数被足够频繁地调用,它实际上胜过其他方法...

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-10-28
    • 1970-01-01
    • 1970-01-01
    • 2022-12-13
    • 2020-08-11
    相关资源
    最近更新 更多