如何通过在数字前加0来格式化数字?


Answers:


593

我发现最好的方法是如下所示:

(请注意,此简单版本仅适用于正整数)

var myNumber = 7;
var formattedNumber = ("0" + myNumber).slice(-2);
console.log(formattedNumber);

对于小数,您可以使用此代码(尽管有点草率)。

var myNumber = 7.5;
var dec = myNumber - Math.floor(myNumber);
myNumber = myNumber - dec;
var formattedNumber = ("0" + myNumber).slice(-2) + dec.toString().substr(1);
console.log(formattedNumber);

最后,如果您不得不处理负数的可能性,则最好存储符号,对数字的绝对值应用格式,然后在事实之后重新应用符号。请注意,此方法并不将数字限制为2位数字。而是仅将数字限制在小数点(整数部分)的左侧。(在此处找到确定标志的行)。

var myNumber = -7.2345;
var sign = myNumber?myNumber<0?-1:1:0;
myNumber = myNumber * sign + ''; // poor man's absolute value
var dec = myNumber.match(/\.\d+$/);
var int = myNumber.match(/^[^\.]+/);

var formattedNumber = (sign < 0 ? '-' : '') + ("0" + int).slice(-2) + (dec !== null ? dec : '');
console.log(formattedNumber);


4
@KeithPower该演示没有说明这一点
Joseph Marikle

1
@KeithPower这是一个演示上述方法的演示:jsfiddle.net/bkTX3。单击该框,更改该值,然后单击该框以查看其运行情况。
Joseph Marikle

1
@Joseph 0.75转化在75
擦伤

@Galled,根据我的经验,这种格式的格式化通常不需要这种东西,但是我整理了涵盖该场景的编辑内容。
Joseph Marikle 2011年

也可以看看.toPrecision()方法w3schools.com/jsref/jsref_toprecision.asp
Oleg

133

如果数字大于9,则将数字转换为字符串(一致性)。否则,添加零。

function n(n){
    return n > 9 ? "" + n: "0" + n;
}

n( 9); //Returns "09"
n(10); //Returns "10"
n(999);//Returns "999"

4
那负面的时间呢?0-1:20:00
mjwrazor '16

131

可以使用任意数量的toLocaleString()方法。因此,对于数字6,如下所示,您可以获得预期的结果。

(6).toLocaleString('en-US', {minimumIntegerDigits: 2, useGrouping:false})

将生成字符串“ 06”。


17
绝对比用手切弦好。更简洁地说,如果您的网页可能在美国以外的地方使用,则可能需要进行以下调整:(6).toLocaleString(undefined, {minimumIntegerDigits: 2})
Mark Slater

2
与IE 9一起使用可创建6.00而不是06。–
Drew

1
可行

或使用intl.js polyfil
maxisam,

2
我全都无视IE,但是它在移动浏览器中没有得到很好的支持。SRC:developer.mozilla.org/en/docs/Web/JavaScript/Reference/...
chetan92

50

这是我通常使用的简单数字填充功能。它允许任何数量的填充。

function leftPad(number, targetLength) {
    var output = number + '';
    while (output.length < targetLength) {
        output = '0' + output;
    }
    return output;
}

例子:

leftPad(1, 2) // 01
leftPad(10, 2) // 10
leftPad(100, 2) // 100
leftPad(1, 3) // 001
leftPad(1, 8) // 00000001

也有负面的时间问题。有解决办法吗?
mjwrazor

39

在所有现代浏览器中,您都可以使用

numberStr.padStart(2, "0");

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/padStart

function zeroPad(numberStr) {
  return numberStr.padStart(2, "0");
}

var numbers = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

numbers.forEach(
  function(num) {
    var numString = num.toString();
    
    var paddedNum = zeroPad(numString);

    console.log(paddedNum);
  }
);



同样,它在某些较旧版本的节点(可能比8号节点更旧的版本)中
不起作用

20

@Lifehack的回答对我非常有用;我认为我们可以在一行中做到正数

 String(input).padStart(2, '0');

12
("0" + (date.getMonth() + 1)).slice(-2);
("0" + (date.getDay())).slice(-2);

1
我认为您指的是以下几点才能获得每月的这一天:("0" + (date.getDate())).slice(-2);
Jeff Moeller

11

你可以做:

function pad2(number) {
   return (number < 10 ? '0' : '') + number
}

例:

document.write(pad2(0) + '<br />');
document.write(pad2(1) + '<br />');
document.write(pad2(2) + '<br />');
document.write(pad2(10) + '<br />');
document.write(pad2(15) + '<br />');

结果:

00
01
02
10
15

8

看来您可能有一个字符串,而不是数字。用这个:

var num = document.getElementById('input').value,
    replacement = num.replace(/^(\d)$/, '0$1');
document.getElementById('input').value = replacement;

这是一个示例:http : //jsfiddle.net/xtgFp/


7

快速而肮脏的一根内衬。

function zpad(n, len) {
  return 0..toFixed(len).slice(2,-n.toString().length)+n.toString();
}

1
很棒的工作。最好像这样使用它作为扩展方法:Number.prototype.leftPad = String.prototype.leftPad = function (pad) { return 0..toFixed(pad).slice(2, -this.toString().length) + this.toString(); };
ConductedClever

6

这很简单,效果很好:

function twoDigit(number) {
  var twodigit = number >= 10 ? number : "0"+number.toString();
  return twodigit;
}

1
可以写成:返回数字> = 10?number:“ 0” + number.toString();
2015年

6

这是一个非常简单的解决方案,对我来说效果很好。

首先声明一个变量来保存您的号码。

var number;

现在将数字转换为字符串并将其保存在另一个变量中;

var numberStr = number.toString();

现在,您可以测试此字符串的长度,如果它小于期望的长度,则可以在开头添加“零”。

if(numberStr.length < 2){
      number = '0' + number;
}

现在根据需要使用数字

console.log(number);

6

这是我找到的最简单的解决方案:-

let num = 9; // any number between 0 & 99
let result = ( '0' + num ).substr( -2 );

5

先前答案的改进版本

function atLeast2Digit(n){
    n = parseInt(n); //ex. if already passed '05' it will be converted to number 5
    var ret = n > 9 ? "" + n: "0" + n;
    return ret;
}

alert(atLeast2Digit(5));


5

我知道这是一篇很古老的文章,但是我想提供一个更灵活和面向对象的解决方案。

我已经推断出可接受的答案,并扩展了javascript的Number对象以允许可调整的零填充:

Number.prototype.zeroPad = function(digits) {
  var loop = digits;
  var zeros = "";
  while (loop) {
    zeros += "0";
    loop--;
  }
  return (this.toString().length > digits) ?
    this.toString() : (zeros + this).slice(-digits);
}
var v = 5;
console.log(v.zeroPad(2)); // returns "05"
console.log(v.zeroPad(4)); // returns "0005"

编辑:添加代码以防止截断比您要求的数字长的数字。

注意:除IE之外,这已全部淘汰。使用padStart()代替。


4

没有用于JavaScript的内置数字格式器,但是有一些库可以完成此操作:

  1. 下划线提供sprintf函数(以及许多其他有用的格式化程序)
  2. javascript-sprintf,underscore.string是从中借用的。

3

要么

function zpad(n,l){
   return rep(l-n.toString().length, '0') + n.toString();
}

function rep(len, chr) { 
   return new Array(len+1).join(chr);
}

3

如果要同时限制位数:

function pad2(number) {
  number = (number < 10 ? '0' : '') + number;
  number = number.substring(0,2);
  return number;
}

这也将切碎任何超过两位数的值。我一直在扩展fanaur的解决方案。


2
<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                $('#test').keypress(allowOnlyTwoPositiveDigts);
            });

            function allowOnlyTwoPositiveDigts(e){

                var test = /^[\-]?[0-9]{1,2}?$/
                return test.test(this.value+String.fromCharCode(e.which))
            }

        </script>
    </head>
    <body>
        <input id="test" type="text" />
    </body>
</html>

2

这是适用于任意数字的简单递归解决方案。

function numToNDigitStr(num, n)
{
    if(num >=  Math.pow(10, n - 1)) { return num; }
    return "0" + numToNDigitStr(num, n-1);
}

2

如果您的项目中没有lodash,那么仅使用一个函数就添加整个库将是一个过大的杀伤力。这是我见过的最复杂的解决方案。

_.padStart(num, 2, '0')

1

这是我的版本。可以轻松适应其他情况。

function setNumericFormat(value) {
    var length = value.toString().length;
    if (length < 4) {
        var prefix = "";
        for (var i = 1; i <= 4 - length; i++) {
            prefix += "0";
        }
        return prefix + value.toString();
    }
    return  value.toString();
}

1
    function colorOf(r,g,b){
  var f = function (x) {
    return (x<16 ? '0' : '') + x.toString(16) 
  };

  return "#" +  f(r) + f(g) + f(b);
}

您应该考虑添加一些上下文,而不仅仅是在答案中添加代码。
迈克,

1

对于任何想要时差并且结果可以取负数的人来说,这都是一个很好的选择。pad(3)=“ 03”,pad(-2)=“ -02”,pad(-234)=“ -234”

pad = function(n){
  if(n >= 0){
    return n > 9 ? "" + n : "0" + n;
  }else{
    return n < -9 ? "" + n : "-0" + Math.abs(n);
  }
}

1

使用此功能,您可以使用任意n位数字进行打印

function frmtDigit(num, n) {
    isMinus = num < 0;
    if (isMinus)
        num *= -1;
    digit = '';
    if (typeof n == 'undefined')
        n = 2;//two digits
    for (i = 1; i < n; i++) {
        if (num < (1 + Array(i + 1).join("0")))
            digit += '0';
    }
    digit = (isMinus ? '-' : '') + digit + num;
    return digit;
};

1

我的例子是

<div id="showTime"></div>

    function x() {
    var showTime = document.getElementById("showTime");
    var myTime = new Date();
    var hour = myTime.getHours();
    var minu = myTime.getMinutes();
    var secs = myTime.getSeconds();
    if (hour < 10) {
        hour = "0" + hour
    };
    if (minu < 10) {
        minu = "0" + minu
    };
    if (secs < 10) {
        secs = "0" + secs
    };

    showTime.innerHTML = hour + ":" + minu + ":" + secs;
}

setInterval("x()", 1000)

1

`${number}`.replace(/^(\d)$/, '0$1');

正则表达式是最好的。


这似乎与上述乔的答案几乎完全相同。请考虑添加其他信息以改善您的答案,或者将其完全删除。
伊桑(Ethan)

1

Java脚本中的AS数据类型是动态确定的,它将04视为4。如果value小于10,则使用条件语句,然后在其前面加上0(通过将其 设为字符串),例如,

var x=4;
  x = x<10?"0"+x:x
 console.log(x); // 04

1

我构建了一个非常简单的格式函数,当我需要格式化一个简单的日期时会调用它。它处理的是将小于10的一位数字格式化为两位数字。它会将日期格式化为Sat Sep 29 2018 - 00:05:44

此函数用作utils变量的一部分,因此称为:

let timestamp = utils._dateFormatter('your date string');

var utils = {
  _dateFormatter: function(dateString) {
    let d = new Date(dateString);
    let hours = d.getHours();
    let minutes = d.getMinutes();
    let seconds = d.getSeconds();
    d = d.toDateString();
    if (hours < 10) {
      hours = '0' + hours;
    }
    if (minutes < 10) {
      minutes = '0' + minutes;
    }
    if (seconds < 10) {
      seconds = '0' + seconds;
    }
    let formattedDate = d + ' - ' + hours + ':' + minutes + ':' + seconds;
    return formattedDate;
  }
}

1

已更新ES6箭头功能(几乎所有现代浏览器都支持,请参见CanIUse

const formatNumber = n => ("0" + n).slice(-2);
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.