Come posso riempire un valore con zeri iniziali?

Qual è il modo consigliato per zerofillare un valore in JavaScript? Immagino di poter costruire una funzione personalizzata per il pad zeri su un valore tipizzato, ma mi chiedo se esiste un modo più diretto per farlo?

Nota: Per "zerofilled" intendo nel senso del database la parola (dove una rappresentazione zerofilled a 6 cifre del numero 5 sarebbe "000005").

Nota per i lettori!

Come hanno sottolineato i commentatori, questa soluzione è "intelligente", e come spesso lo sono soluzioni intelligenti, è ad alta intensità di memoria e relativamente lenta. Se le prestazioni sono un problema per te, non usare questa soluzione!

Potenzialmente obsoleto : ECMAScript 2017 include String.prototype.padStart e Number.prototype.toLocaleString è presente da ECMAScript 3.1. Esempio:

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

... genererà "-0000.10".

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

... genererà "-0000.1".

Una semplice funzione è tutto ciò che serve

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
}

potresti farlo in una libreria se vuoi conservare lo spazio dei nomi o altro. Come con l'estensione di jQuery .

Modo semplice. È possibile aggiungere una moltiplicazione di stringhe per il pad e trasformarla in una funzione.

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

Come una funzione,

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

Non posso credere a tutte le risposte complesse qui ... Usa questo:

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

In realtà ho dovuto inventarmi qualcosa del genere di recente. Ho pensato che ci doveva essere un modo per farlo senza usare i loop.

Questo è quello che mi è venuto in mente.

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

Quindi basta usarlo fornendo un numero a zero pad:

> zeroPad(50,4);
"0050"

Se il numero è maggiore dell'imbottitura, il numero si espanderà oltre l'imbottitura:

> zeroPad(51234, 3);
"51234"

Anche i decimali vanno bene!

> zeroPad(51.1234, 4);
"0051.1234"

Se non ti dispiace inquinare lo spazio dei nomi globale, puoi aggiungerlo direttamente a 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;
}

E se preferisci che i decimali occupino spazio nell'imbottitura:

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

Saluti!

XDR si avvicinò con una variazione logaritmica che sembra funzionare meglio.

ATTENZIONE : questa funzione fallisce se num è uguale a zero (es. 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;
}

A proposito di prestazioni, tomsmeding ha confrontato le prime 3 risposte ( 4 con la variazione del registro ). Indovina quale ha sovraperformato notevolmente gli altri due? :)

Ecco cosa ho usato per riempire un numero fino a 7 caratteri.

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

Questo approccio sarà probabilmente sufficiente per la maggior parte delle persone.

Modifica: se vuoi renderlo più generico puoi farlo:

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

Modifica 2: Nota che da ES2017 puoi usare String.prototype.padStart:

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

I browser moderni ora supportano padStart, ora puoi semplicemente fare:

string.padStart(maxLength, "0");

Esempio:

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

Sfortunatamente, ci sono molti suggerimenti inutili e complicati per questo problema, che in genere comportano la scrittura della propria funzione per eseguire operazioni matematiche o di stringa o chiamare un'utilità di terze parti. Tuttavia, esiste un modo standard per farlo nella libreria JavaScript di base con una sola riga di codice. Potrebbe valere la pena racchiudere questa riga di codice in una funzione per evitare di dover specificare parametri che non si desidera modificare come il nome o lo stile locale.

var amount = 5;

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

Questo produrrà il valore di "005" per il testo. È inoltre possibile utilizzare la funzione toLocaleString di Number per spostare gli zeri sul lato destro del punto decimale.

var amount = 5;

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

Questo produrrà il valore di "5.00" per il testo. Cambia useGrouping su true per usare i separatori di virgola per migliaia.

Si noti che l'utilizzo toLocaleString()con localese optionsargomenti è standardizzato separatamente in ECMA-402 , non in ECMAScript. Ad oggi, alcuni browser implementano solo il supporto di base , ovvero toLocaleString()possono ignorare qualsiasi argomento.

Esempio completo

Se il numero di riempimento è noto in anticipo per non superare un determinato valore, esiste un altro modo per farlo senza loop:

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

Casi di prova qui: http://jsfiddle.net/jfriend00/N87mZ/

Il modo rapido e sporco:

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

Per x = 5 e count = 6 avrai y = "000005"

Ecco una funzione rapida che mi è venuta in mente per fare il lavoro. Se qualcuno ha un approccio più semplice, sentiti libero di condividere!

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

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

    return result;
}

In ritardo alla festa qui, ma uso spesso questo costrutto per eseguire il riempimento ad hoc di un certo valore n, noto per essere un decimale positivo:

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

Dove offsetsono 10 ^^ cifre.

Ad esempio, riempimento a 5 cifre, dove n = 123:

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

La versione esadecimale di questo è leggermente più dettagliata:

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

Nota 1: Mi piace anche la soluzione di @ profitehlolz, che è la versione stringa di questo, usando la caratteristica nifty di indice negativo di slice ().

Non so davvero perché, ma nessuno lo ha fatto nel modo più ovvio. Ecco la mia implementazione.

Funzione:

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

Prototipo:

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

Molto semplice, non vedo in alcun modo come questo possa essere più semplice. Per qualche motivo, qui su SO mi sono sembrato molte volte, le persone cercano solo di evitare i cicli "for" e "while" a tutti i costi. L'uso di regex probabilmente costerà molti più cicli per una così banale imbottitura a 8 cifre.

Uso questo snipet per ottenere una rappresentazione a 5 cifre

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

ECMAScript 2017: usa padStart o padEnd

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

Ulteriori informazioni:

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

Il potere della matematica!

x = numero intero da pad
y = numero di zero da pad

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

Non ho visto nessuno sottolineare il fatto che quando usi String.prototype.substr () con un numero negativo conta da destra.

Una soluzione di una riga alla domanda del PO, una rappresentazione zerofilled a 6 cifre del numero 5, è:

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

Generalizzando otterremo:

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

Dopo un lungo, lungo periodo di test di 15 diverse funzioni / metodi trovati nelle risposte a queste domande, ora so qual è il migliore (il più versatile e il più veloce).

Ho preso 15 funzioni / metodi dalle risposte a questa domanda e ho creato uno script per misurare il tempo impiegato per eseguire 100 pad. Ogni pad riempirebbe il numero 9di 2000zeri. Questo può sembrare eccessivo, e lo è, ma ti dà una buona idea sul ridimensionamento delle funzioni.

Il codice che ho usato può essere trovato qui: https://gist.github.com/NextToNothing/6325915

Sentiti libero di modificare e testare il codice tu stesso.

Per ottenere il metodo più versatile, devi utilizzare un ciclo. Questo perché con numeri molto grandi è probabile che altri falliscano, mentre ciò avrà successo.

Quindi, quale loop usare? Bene, sarebbe un whileciclo. Un forloop è ancora veloce, ma un whileloop è solo leggermente più veloce (un paio di ms) - e più pulito.

Risposte come quelle di Wilco, Aleksandar Topleko Vitim.usfaranno perfettamente il lavoro.

Personalmente, ho provato un approccio diverso. Ho provato a usare una funzione ricorsiva per riempire la stringa / numero. Ha funzionato meglio dei metodi che si uniscono ad un array ma, comunque, non ha funzionato velocemente come un ciclo for.

La mia funzione è:

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

Puoi usare la mia funzione con o senza l'impostazione della variabile padding. Quindi in questo modo:

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

Personalmente, dopo i miei test, userei un metodo con un ciclo while, come Aleksandar Topleko Vitim.us. Tuttavia, lo modificherei leggermente in modo da poter impostare la stringa di riempimento.

Quindi, vorrei usare questo codice:

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'

Puoi anche usarlo come funzione prototipo, usando questo codice:

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'

Il primo parametro è qualsiasi numero reale, il secondo parametro è un numero intero positivo che specifica il numero minimo di cifre a sinistra del punto decimale e il terzo parametro è un numero intero opzionale che specifica il numero se cifre a destra del punto decimale.

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
}

così

           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'

Non reinventare la ruota, usa la stringa di sottolineatura :

jsFiddle

var numToPad = '5';

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

Questa è la soluzione ES6.

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

In tutti i browser moderni è possibile utilizzare

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

Ecco il riferimento MDN https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart

Non che questa domanda abbia bisogno di più risposte, ma ho pensato di aggiungere la semplice versione lodash di questo.

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

L'ultimo modo per farlo è molto più semplice:

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

output: "02"

Solo un'altra soluzione, ma penso che sia più leggibile.

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

Questo è meno nativo, ma potrebbe essere il più veloce ...

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

La mia soluzione

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

uso

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

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

Perché non usare la ricorsione?

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

Alcuni monkeypatch funzionano anche

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

...eccetera.

Saluti

La soluzione più semplice e diretta che troverai.

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