선행 0으로 값을 채우려면 어떻게해야합니까?

JavaScript에서 값을 0으로 채우는 권장되는 방법은 무엇입니까? 타입 캐스팅 된 값에 0을 채우는 사용자 정의 함수를 만들 수 있다고 생각하지만 더 직접적인 방법이 있는지 궁금합니다.

참고 : "제로 채워짐"이란 단어의 데이터베이스 의미에서 의미합니다 (숫자 5의 6 자리 숫자로 채워진 표현은 "000005"입니다).

독자에게 참고하십시오!

주석가들이 지적했듯이,이 솔루션은 "영리한"솔루션이며, 영리한 솔루션 인 것처럼 메모리 집약적이고 상대적으로 느립니다. 성능이 문제가되는 경우이 솔루션을 사용하지 마십시오!

구식 일 가능성 : ECMAScript 2017 포함 String.prototype.padStart 및 Number.prototype.toLocaleString는 ECMAScript를 3.1 이후있다. 예:

var n=-0.1;
n.toLocaleString('en', {minimumIntegerDigits:4,minimumFractionDigits:2,useGrouping:false})

"-0000.10"을 출력합니다.

// or 
const padded = (.1+"").padStart(6,"0");
`-${padded}`

"-0000.1"이 출력됩니다.

간단한 기능 만 있으면됩니다

function zeroFill( number, width )
{
  width -= number.toString().length;
  if ( width > 0 )
  {
    return new Array( width + (/\./.test( number ) ? 2 : 1) ).join( '0' ) + number;
  }
  return number + ""; // always return a string
}

네임 스페이스 등을 보존하려는 경우이를 라이브러리에 구울 수 있습니다. 와 같이 jQuery를이 확장이다 .

간단한 방법. 패드에 문자열 곱셈을 추가하여 함수로 바꿀 수 있습니다.

var pad = "000000";
var n = '5';
var result = (pad+n).slice(-pad.length);

함수로서

function paddy(num, padlen, padchar) {
    var pad_char = typeof padchar !== 'undefined' ? padchar : '0';
    var pad = new Array(1 + padlen).join(pad_char);
    return (pad + num).slice(-pad.length);
}
var fu = paddy(14, 5); // 00014
var bar = paddy(2, 4, '#'); // ###2

나는 여기에 대한 모든 복잡한 대답을 믿을 수 없다 ... 그냥 이것을 사용하십시오 :

var zerofilled = ('0000'+n).slice(-4);

나는 최근에 이와 비슷한 것을 생각해 내야했다. 루프를 사용하지 않고 할 수있는 방법이 있어야한다고 생각했습니다.

이것이 내가 생각해 낸 것입니다.

function zeroPad(num, numZeros) {
    var n = Math.abs(num);
    var zeros = Math.max(0, numZeros - Math.floor(n).toString().length );
    var zeroString = Math.pow(10,zeros).toString().substr(1);
    if( num < 0 ) {
        zeroString = '-' + zeroString;
    }

    return zeroString+n;
}

그런 다음 제로 패드에 숫자를 제공하여 사용하십시오.

> zeroPad(50,4);
"0050"

숫자가 패딩보다 크면 숫자가 패딩을 넘어 확장됩니다.

> zeroPad(51234, 3);
"51234"

소수도 괜찮습니다!

> zeroPad(51.1234, 4);
"0051.1234"

전역 네임 스페이스를 오염시키지 않아도 Number에 직접 추가 할 수 있습니다.

Number.prototype.leftZeroPad = function(numZeros) {
    var n = Math.abs(this);
    var zeros = Math.max(0, numZeros - Math.floor(n).toString().length );
    var zeroString = Math.pow(10,zeros).toString().substr(1);
    if( this < 0 ) {
        zeroString = '-' + zeroString;
    }

    return zeroString+n;
}

패딩에서 소수점 이하 자리를 차지하려면 다음과 같이하십시오.

Number.prototype.leftZeroPad = function(numZeros) {
    var n = Math.abs(this);
    var zeros = Math.max(0, numZeros - n.toString().length );
    var zeroString = Math.pow(10,zeros).toString().substr(1);
    if( this < 0 ) {
        zeroString = '-' + zeroString;
    }

    return zeroString+n;
}

건배!

XDR 은 더 나은 성능을 보이는 로그 변형 을 만들어 냈습니다 .

경고 :이 함수는 숫자가 0과 같은 경우 실패합니다 (예 : zeropad (0, 2))

function zeroPad (num, numZeros) {
    var an = Math.abs (num);
    var digitCount = 1 + Math.floor (Math.log (an) / Math.LN10);
    if (digitCount >= numZeros) {
        return num;
    }
    var zeroString = Math.pow (10, numZeros - digitCount).toString ().substr (1);
    return num < 0 ? '-' + zeroString + an : zeroString + an;
}

tomsmeding 은 성능에 대해 상위 3 개의 답변을 비교했습니다 ( 4는 로그 변형 ). 어느 쪽 이 다른 쪽을 크게 능가할까요? :)

다음은 최대 7 자의 숫자를 채우는 데 사용한 것입니다.

("0000000" + number).slice(-7)

이 방법은 아마도 대부분의 사람들에게 충분할 것입니다.

편집 : 좀 더 일반적인 것으로 만들려면 다음을 수행하십시오.

("0".repeat(padding) + number).slice(-padding)

편집 2 : ES2017부터 다음을 사용할 수 있습니다 String.prototype.padStart.

number.toString().padStart(padding, "0")

최신 브라우저는 이제를 지원합니다. 이제 padStart간단하게 수행 할 수 있습니다.

string.padStart(maxLength, "0");

예:

string = "14";
maxLength = 5; // maxLength is the max string length, not max # of fills
res = string.padStart(maxLength, "0");
console.log(res); // prints "00014"

불행하게도,이 문제에 대한 복잡한 제안은 많지 않습니다. 일반적으로 수학이나 문자열 조작을위한 자신의 함수를 작성하거나 타사 유틸리티를 호출하는 것과 관련이 있습니다. 그러나 기본 JavaScript 라이브러리에는 한 줄의 코드만으로이 작업을 수행하는 표준 방법이 있습니다. 로컬 이름이나 스타일처럼 절대 변경하지 않으려는 매개 변수를 지정하지 않아도되도록 함수에이 한 줄의 코드를 래핑하는 것이 좋습니다.

var amount = 5;

var text = amount.toLocaleString('en-US',
{
    style: 'decimal',
    minimumIntegerDigits: 3,
    useGrouping: false
});

텍스트에 대해 "005"값이 생성됩니다. Number의 toLocaleString 함수를 사용하여 소수점 오른쪽에 0을 채울 수도 있습니다.

var amount = 5;

var text = amount.toLocaleString('en-US',
{
    style: 'decimal',
    minimumFractionDigits: 2,
    useGrouping: false
});

텍스트의 값이 "5.00"이됩니다. 수천에 쉼표 구분 기호를 사용하려면 useGrouping을 true로 변경하십시오.

toLocaleString()with locales및 optionsarguments 사용 은 ECMAScript가 아니라 ECMA-402에서 개별적으로 표준화됩니다 . 현재 일부 브라우저 는 기본 지원 만 구현합니다 . 즉, toLocaleString()모든 인수를 무시할 수 있습니다.

완전한 예

채우기 번호가 미리 특정 값을 초과하지 않는 것으로 알려진 경우 루프없이이를 수행하는 다른 방법이 있습니다.

var fillZeroes = "00000000000000000000";  // max number of zero fill ever asked for in global

function zeroFill(number, width) {
    // make sure it's a string
    var input = number + "";  
    var prefix = "";
    if (input.charAt(0) === '-') {
        prefix = "-";
        input = input.slice(1);
        --width;
    }
    var fillAmt = Math.max(width - input.length, 0);
    return prefix + fillZeroes.slice(0, fillAmt) + input;
}

여기에서 테스트 사례 : http://jsfiddle.net/jfriend00/N87mZ/

빠르고 더러운 방법 :

y = (new Array(count + 1 - x.toString().length)).join('0') + x;

x = 5이고 count = 6 인 경우 y = "000005"입니다.

다음은 작업을 수행하기 위해 고안 한 빠른 기능입니다. 누구나 간단한 접근 방식을 가지고 있다면 자유롭게 공유하십시오!

function zerofill(number, length) {
    // Setup
    var result = number.toString();
    var pad = length - result.length;

    while(pad > 0) {
        result = '0' + result;
        pad--;
    }

    return result;
}

여기 파티에 늦었지만, 종종 n양의 소수로 알려진 일부 값의 임시 패딩을 수행하기 위해이 구성을 사용합니다 .

(offset + n + '').substr(1);

offset10 ^^ 자리는 어디 입니까?

예 : 패딩을 5 자리로, 여기서 n = 123 :

(1e5 + 123 + '').substr(1); // => 00123

이 16 진수 버전은 약간 더 장황합니다 :

(0x100000 + 0x123).toString(16).substr(1); // => 00123

참고 1 : @profitehlolz의 솔루션도 좋아합니다. 이것은 slice ()의 멋진 음수 색인 기능을 사용하는 문자열 버전입니다.

나는 왜 그런지 정말로 모른다. 그러나 아무도 가장 명백한 방법으로 그것을하지 않았다. 여기 내 구현입니다.

함수:

/** Pad a number with 0 on the left */
function zeroPad(number, digits) {
    var num = number+"";
    while(num.length < digits){
        num='0'+num;
    }
    return num;
}

원기:

Number.prototype.zeroPad=function(digits){
    var num=this+"";
    while(num.length < digits){
        num='0'+num;
    }
    return(num);
};

매우 간단합니다. 어떻게 이것이 더 간단 할 수 있는지 알 수 없습니다. 어떤 이유로 나는 여기에 여러 번 보였으므로 사람들은 어떤 비용 으로든 'for'및 'while'루프를 피하려고합니다. 정규식을 사용하면 사소한 8 자리 패딩에 더 많은 사이클이 필요할 것입니다.

이 스 니펫을 사용하여 5 자리 표시를 얻습니다.

(value+100000).toString().slice(-5) // "00123" with value=123

ECMAScript 2017 : padStart 또는 padEnd 사용

'abc'.padStart(10);         // "       abc"
'abc'.padStart(10, "foo");  // "foofoofabc"
'abc'.padStart(6,"123465"); // "123abc"

더 많은 정보:

• https://github.com/tc39/proposal-string-pad-start-end
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart

수학의 힘!

x = 패드까지의 정수
y = 패드까지의 제로 수

function zeroPad(x, y)
{
   y = Math.max(y-1,0);
   var n = (x / Math.pow(10,y)).toFixed(y);
   return n.replace('.','');  
}

String.prototype.substr () 을 사용할 때 아무도 사실을 지적하지 못했습니다.음수로 오른쪽부터 계산 .

OP의 질문에 대한 하나의 라이너 솔루션, 숫자 5로 채워진 6 자리 숫자는 다음과 같습니다.

console.log(("00000000" + 5).substr(-6));

우리가 얻을 수있는 일반화 :

function pad(num, len) { return ("00000000" + num).substr(-len) };

console.log(pad(5, 6));
console.log(pad(45, 6));
console.log(pad(345, 6));
console.log(pad(2345, 6));
console.log(pad(12345, 6));

이 질문에서 찾은 15 가지 기능 / 방법을 오랫동안 테스트 한 결과, 이제 가장 적합한 (가장 다재다능하고 빠른) 것을 알고 있습니다.

이 질문에 대한 답변에서 15 가지 기능 / 방법을 사용하여 100 개의 패드를 실행하는 데 걸리는 시간을 측정하는 스크립트를 만들었습니다. 각 패드는 숫자 9로2000 0 웁니다. 이것은 과도하게 보일 수 있지만 기능의 스케일링에 대한 좋은 아이디어를 제공합니다.

내가 사용한 코드는 여기에서 찾을 수 있습니다 : https://gist.github.com/NextToNothing/6325915

코드를 직접 수정하고 테스트하십시오.

가장 다양한 방법을 사용하려면 루프를 사용해야합니다. 다른 많은 사람들이 실패 할 가능성이 높지만 성공할 수 있기 때문입니다.

어떤 루프를 사용해야합니까? 글쎄, 그것은 while루프 일 것입니다. for루프는 빠른 아직이지만,while 루프는 약간 빨리 (석사의 커플) - 그리고 청소기.

에 의한 것과 같은 답변 Wilco, Aleksandar Toplek또는Vitim.us 완벽하게 일을 할 것입니다.

개인적으로 다른 접근법을 시도했습니다. 재귀 함수를 사용하여 문자열 / 숫자를 채우려 고했습니다. 배열을 조인하는 메소드보다 잘 작동했지만 여전히 for 루프만큼 빨리 작동하지 않았습니다.

내 기능은 다음과 같습니다

function pad(str, max, padder) {
  padder = typeof padder === "undefined" ? "0" : padder;
  return str.toString().length < max ? pad(padder.toString() + str, max, padder) : str;
}

패딩 변수를 설정하거나 설정하지 않고 내 기능을 사용할 수 있습니다. 이렇게 이렇게 :

pad(1, 3); // Returns '001'
// - Or -
pad(1, 3, "x"); // Returns 'xx1'

개인적으로, 내 테스트 후, 내가 좋아하는, while 루프와 방법을 사용 Aleksandar Toplek하거나 Vitim.us. 그러나 패딩 문자열을 설정할 수 있도록 약간 수정합니다.

따라서이 코드를 사용합니다.

function padLeft(str, len, pad) {
    pad = typeof pad === "undefined" ? "0" : pad + "";
    str = str + "";
    while(str.length < len) {
        str = pad + str;
    }
    return str;
}

// Usage
padLeft(1, 3); // Returns '001'
// - Or -
padLeft(1, 3, "x"); // Returns 'xx1'

이 코드를 사용하여 프로토 타입 함수로 사용할 수도 있습니다.

Number.prototype.padLeft = function(len, pad) {
    pad = typeof pad === "undefined" ? "0" : pad + "";
    var str = this + "";
    while(str.length < len) {
        str = pad + str;
    }
    return str;
}

// Usage
var num = 1;

num.padLeft(3); // Returns '001'
// - Or -
num.padLeft(3, "x"); // Returns 'xx1'

첫 번째 매개 변수는 실수이고 두 번째 매개 변수는 소수점 왼쪽의 최소 자릿수를 지정하는 양의 정수이고 세 번째 매개 변수는 소수점 오른쪽의 자릿수를 지정하는 선택적 양의 정수입니다.

function zPad(n, l, r){
    return(a=String(n).match(/(^-?)(\d*)\.?(\d*)/))?a[1]+(Array(l).join(0)+a[2]).slice(-Math.max(l,a[2].length))+('undefined'!==typeof r?(0<r?'.':'')+(a[3]+Array(r+1).join(0)).slice(0,r):a[3]?'.'+a[3]:''):0
}

그래서

           zPad(6, 2) === '06'
          zPad(-6, 2) === '-06'
       zPad(600.2, 2) === '600.2'
        zPad(-600, 2) === '-600'
         zPad(6.2, 3) === '006.2'
        zPad(-6.2, 3) === '-006.2'
      zPad(6.2, 3, 0) === '006'
        zPad(6, 2, 3) === '06.000'
    zPad(600.2, 2, 3) === '600.200'
zPad(-600.1499, 2, 3) === '-600.149'

바퀴를 다시 만들지 말고 밑줄 문자열을 사용하십시오 .

jsFiddle

var numToPad = '5';

alert(_.str.pad(numToPad, 6, '0')); // yields: '000005'

이것이 ES6 솔루션입니다.

function pad(num, len) {
  return '0'.repeat(len - num.toString().length) + num;
}
alert(pad(1234,6));

모든 최신 브라우저에서 사용할 수 있습니다

numberStr.padStart(numberLength, "0");

function zeroFill(num, numLength) {
  var numberStr = num.toString();

  return numberStr.padStart(numLength, "0");
}

var numbers = [0, 1, 12, 123, 1234, 12345];

numbers.forEach(
  function(num) {
    var numString = num.toString();
    
    var paddedNum = zeroFill(numString, 5);

    console.log(paddedNum);
  }
);

다음은 MDN 참조입니다 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart

이 질문에 더 많은 답변이 필요하다는 것은 아니지만 간단한 lodash 버전을 추가 할 것이라고 생각했습니다.

_.padLeft(number, 6, '0')

가장 최신 방법은 다음과 같습니다.

var number = 2
number.toLocaleString(undefined, {minimumIntegerDigits:2})

output: "02"

또 다른 해결책이지만 더 읽기 쉽다고 생각합니다.

function zeroFill(text, size)
{
  while (text.length < size){
  	text = "0" + text;
  }
  
  return text;
}

이것은 네이티브가 아니지만 가장 빠를 수도 있습니다 ...

zeroPad = function (num, count) {
    var pad = (num + '').length - count;
    while(--pad > -1) {
        num = '0' + num;
    }
    return num;
};

내 솔루션

Number.prototype.PadLeft = function (length, digit) {
    var str = '' + this;
    while (str.length < length) {
        str = (digit || '0') + str;
    }
    return str;
};

용법

var a = 567.25;
a.PadLeft(10); // 0000567.25

var b = 567.25;
b.PadLeft(20, '2'); // 22222222222222567.25

왜 재귀를 사용하지 않습니까?

function padZero(s, n) {
    s = s.toString(); // in case someone passes a number
    return s.length >= n ? s : padZero('0' + s, n);
}

일부 몽키 패칭도 작동합니다

String.prototype.padLeft = function (n, c) {
  if (isNaN(n))
    return null;
  c = c || "0";
  return (new Array(n).join(c).substring(0, this.length-n)) + this; 
};
var paddedValue = "123".padLeft(6); // returns "000123"
var otherPadded = "TEXT".padLeft(8, " "); // returns "    TEXT"

function pad(toPad, padChar, length){
    return (String(toPad).length < length)
        ? new Array(length - String(toPad).length + 1).join(padChar) + String(toPad)
        : toPad;
}

pad(5, 0, 6) = 000005

pad('10', 0, 2) = 10 // don't pad if not necessary

pad('S', 'O', 2) = SO

...기타.

건배

간단한 찾을 것, 가장 솔직 솔루션입니다.

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