0을 한 자리 숫자 앞에 추가하여 숫자 서식을 지정하는 방법은 무엇입니까?


답변:


594

내가 찾은 가장 좋은 방법은 다음과 같습니다.

(이 간단한 버전은 양의 정수에만 작동합니다.)

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

1
@KeithPower 다음은 위의 방법을 보여주는 데모입니다 : jsfiddle.net/bkTX3 . 상자를 클릭하고 값을 변경 한 다음 상자를 클릭하여 작동하는지 확인하십시오.
Joseph Marikle

1
@Joseph .75는 75로 변환됩니다.
Galled

@ 일반적으로 이런 경험이 필요하지는 않지만 이런 시나리오를 다루는 편집본을 함께 모았습니다.
Joseph Marikle

또한 w3schools.com/jsref/jsref_toprecision.asp.toPrecision() 방법을 살펴보십시오
Oleg

133

숫자가 9보다 큰 경우 숫자를 문자열 (일관성)로 변환하십시오. 그렇지 않으면 0을 추가하십시오.

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

131

원하는 수의 toLocaleString () 메소드를 사용하십시오. 따라서 숫자 6의 경우 아래와 같이 원하는 결과를 얻을 수 있습니다.

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

문자열 '06'을 생성합니다.


17
이다 확실히 더 나은 손으로 문자열을 자르고보다. 좀 더 간결하게 말하면, 미국 이외의 지역에서 페이지를 사용할 수 있다면 다음과 같이 조정할 수 있습니다.(6).toLocaleString(undefined, {minimumIntegerDigits: 2})
Mark Slater

2
이것을 IE 9와 함께 사용하면 06 대신 6.00이 생성됩니다.
Drew

1
작동하지만 IE> = 11이 필요합니다.
Saftpresse99

또는 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/en-US/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보다 오래된 버전)에서는 작동하지 않습니다.
JSilv

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
다음과 같이 쓸 수 있습니다 : return number> = 10? 숫자 : "0"+ number.toString ();
apfz

6

나를 위해 잘 작동하는 매우 간단한 솔루션이 있습니다.

먼저 숫자를 담을 변수를 선언하십시오.

var number;

이제 숫자를 문자열로 변환하고 다른 변수에 유지하십시오.

var numberStr = number.toString();

이제이 문자열의 길이를 테스트 할 수 있습니다. 원하는 길이보다 작 으면 처음에 '0'을 추가 할 수 있습니다.

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

나는 이것이 고대 게시물이라는 것을 알고 있지만 더 유연하고 OO 솔루션 옵션을 제공하고 싶었습니다.

허용되는 답변에 약간의 외삽 법을 적용하고 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()대신 사용하십시오 .



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);
}

답변에 코드뿐만 아니라 컨텍스트를 추가하는 것을 고려해야합니다.
Mike

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');

정규식이 최고입니다.


이것은 위 의 Joe의 대답 과 거의 동일한 것으로 보입니다 . 답변을 향상 시키려면 추가 정보를 추가하거나 완전히 삭제하십시오.
Ethan

1

Javascript의 AS 데이터 유형은 동적으로 결정되며 04를 4로 처리합니다. 값이 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);
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.