Question

Quelle est la méthode recommandée pour ZEROFILL une valeur en JavaScript? J'imagine que je pourrais construire une fonction personnalisée à zéro pad sur une valeur typecasted, mais je me demande s'il y a une façon de faire plus directe cela?

Remarque:. Par "zerofilled" Je veux dire dans le sens de la base de données du mot (où une représentation zerofilled à 6 chiffres du numéro 5 serait "000005")

Était-ce utile?

La solution

  

Note aux lecteurs!

     

Comme les commentateurs l'ont souligné, cette solution est « intelligent », et comme   des solutions intelligentes sont souvent, il est gourmand en mémoire et relativement   lent. Si la performance est une préoccupation pour vous, ne pas utiliser cette solution!

     

potentiellement dépassés : ECMAScript 2017 comprend String.prototype.padStart et Number.prototype.toLocaleString est là depuis ECMAScript 3.1. Exemple:

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

... affichera "-0000,10".

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

... affichera "-0000,1".

Une fonction simple est tout ce que vous avez besoin

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
}

vous pouvez cuire cela dans une bibliothèque si vous voulez conserver l'espace de noms ou autre chose. Comme avec étendre de jQuery .

Autres conseils

Une façon simple. Vous pouvez ajouter la multiplication de chaîne pour le pad et la transformer en une fonction.

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

En fonction,

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

Je ne peux pas croire que toutes les réponses complexes ici ... Il suffit d'utiliser ceci:

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

J'ai dû venir avec quelque chose comme ça récemment. Je me suis dit qu'il devait y avoir un moyen de le faire sans utiliser des boucles.

est ce que je suis venu avec.

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

Ensuite, il suffit d'utiliser ce numéro à fournir un tampon zéro:

> zeroPad(50,4);
"0050"

Si le nombre est plus grand que le rembourrage, le nombre va étendre au-delà du rembourrage:

> zeroPad(51234, 3);
"51234"

Décimales sont bien aussi!

> zeroPad(51.1234, 4);
"0051.1234"

Si vous ne me dérange pas polluer l'espace de noms global, vous pouvez l'ajouter à son numéro:

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

Et si vous préférez avoir décimaux prendre de la place dans le rembourrage:

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

Vive!



XDR est venu avec une variation logarithmique qui semble mieux performer.

AVERTISSEMENT : Cette fonction échoue si num est égal à zéro (par exemple 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;
}

En parlant de performance, tomsmeding par rapport aux 3 réponses haut de ( 4 avec la variation du journal ). Devinez lequel majorly a surperformé les deux autres? :)

Voici ce que je faisais pad un nombre maximum de 7 caractères.

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

Cette approche sera probablement suffisante pour la plupart des gens.

Edit: Si vous voulez le rendre plus générique que vous pouvez faire ceci:

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

Edit 2: Notez que depuis ES2017 vous pouvez utiliser String.prototype.padStart:

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

Malheureusement, il y a beaucoup de suggestions compliquées inutiles pour ce problème, impliquant généralement la rédaction de votre propre fonction pour faire des mathématiques ou la manipulation de chaînes ou d'appeler un utilitaire tiers. Cependant, il existe un moyen standard de faire cela dans la bibliothèque JavaScript de base avec une seule ligne de code. Il pourrait être intéressant d'envelopper cette ligne de code dans une fonction pour éviter de devoir spécifier des paramètres que vous ne souhaitez modifier comme le nom local ou le style.

var amount = 5;

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

Cela produira la valeur de « 005 » pour le texte. Vous pouvez également utiliser la fonction toLocaleString du nombre de zéros pad sur le côté droit de la virgule.

var amount = 5;

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

Cela produira la valeur de « 5,00 » pour le texte. Changer useGrouping true pour utiliser des séparateurs par des virgules pour des milliers.

Notez que l'utilisation toLocaleString() avec des arguments de locales et options est normalisée séparément dans ECMA-402 , pas ECMAScript. A ce jour, certains navigateurs ne mettre en œuvre un soutien de base , à savoir toLocaleString() peut ignorer les arguments.

Exemple complet

Si le numéro de remplissage est connu à l'avance de ne pas dépasser une certaine valeur, il y a une autre façon de le faire sans boucles:

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

Les cas de test ici: http://jsfiddle.net/jfriend00/N87mZ/

Dans un projet (étape 3) méthode ES2017 .padStart() vous pouvez simplement maintenant faire (lorsque mis en œuvre / prise en charge):

string.padStart(maxLength, "0"); //max length is the max string length, not max # of fills

La façon rapide et sale:

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

Pour x = 5 et 6 count = vous aurez y = "000005"

Voici une fonction rapide, je suis venu avec pour faire le travail. Si quelqu'un a une approche plus simple, ne hésitez pas à partager!

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

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

    return result;
}

Fin de la partie ici, mais je l'utilise souvent cette construction pour faire un rembourrage ad hoc de certains n de valeur, connu pour être positif, décimal:

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

offset est 10 ^^ chiffres.

par exemple. Rembourrage à 5 chiffres, où n = 123:

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

La version de ce hexidecimal est un peu plus bavard:

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

Note 1: J'aime @ solution de profitehlolz aussi bien, qui est la version de chaîne de cela, en utilisant une tranche () de l 'indice caractéristique nifty négatif

.

Je ne sais vraiment pas pourquoi, mais personne ne le fait de la manière la plus évidente. Ici, il est ma mise en œuvre.

Fonction:

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

Prototype:

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

Très simple, je ne vois aucune façon comment cela peut être plus simple. Pour une raison quelconque, j'ai semble plusieurs fois ici sur le SO, les gens essaient simplement d'éviter « pour » et « while » boucles à tout prix. L'utilisation des expressions rationnelles va probablement coûter des cycles beaucoup plus pour un rembourrage à 8 chiffres trivial.

J'utilise cette snipet pour obtenir une représentation 5 chiffres

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

La puissance des mathématiques!

x = nombre entier de tampon
y = nombre de zéros à la liste

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

ECMAScript 2017: utiliser padStart ou padEnd

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

Plus d'infos:

Je ne l'ai pas vu personne souligner le fait que lorsque vous utilisez String.prototype.substr () avec un nombre négatif, il compte de la droite.

A une solution de revêtement à la question de l'OP, une représentation zerofilled 6 chiffres du numéro 5, est la suivante:

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

Généralisation nous obtenons:

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

Le premier paramètre est un nombre réel, le deuxième paramètre est un nombre entier positif indiquant le nombre minimum de chiffres à gauche de la virgule et le troisième paramètre est un nombre entier positif facultatif spécifiant le nombre si chiffres à droite du point décimal.

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'

Ne pas réinventer la roue, utilisez souligner chaîne :

jsFiddle

var numToPad = '5';

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

Ceci est la solution ES6.

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

Après une longue, longue période de test de 15 différentes fonctions / méthodes trouvées dans cette questions réponses, je sais maintenant qui est le meilleur (le plus polyvalent et le plus rapide).

J'ai pris 15 fonctions / méthodes des réponses à cette question et fait un script pour mesurer le temps nécessaire pour exécuter 100 pads. Chaque pad serait pad le 9 numéro avec des zéros de 2000. Cela peut sembler excessive, et il est, mais il vous donne une bonne idée de l'échelle des fonctions.

Le code je peut être trouvé ici: https://gist.github.com/NextToNothing/6325915

Sentez-vous libre de modifier et de tester le code vous-même.

Afin d'obtenir la méthode la plus polyvalente, vous devez utiliser une boucle. En effet, avec un très grand nombre d'autres sont susceptibles d'échouer, alors, cela réussira.

Alors, qui boucle à utiliser? Eh bien, ce serait une boucle de while. Une boucle de for est toujours rapide, mais une boucle de while est juste un peu plus rapide (quelques ms) -. Et plus propre

Les réponses comme celles de Wilco, Aleksandar Toplek ou Vitim.us feront le travail parfaitement.

Personnellement, j'ai essayé une approche différente. J'ai essayé d'utiliser une fonction récursive pour pad la chaîne / nombre. Il a travaillé mieux que les méthodes d'assemblage d'un tableau, mais, encore, ne fonctionne pas aussi rapide que pour une boucle.

Ma fonction est:

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

Vous pouvez utiliser ma fonction avec, ou sans, configurer la variable de remplissage. Donc, comme ceci:

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

Personnellement, après mes tests, j'utiliser une méthode avec une boucle while, comme Aleksandar Toplek ou Vitim.us. Cependant, je modifierais légèrement de sorte que vous pouvez définir la chaîne de remplissage.

Alors, je voudrais utiliser ce code:

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'

Vous pouvez également utiliser comme fonction prototype, en utilisant ce code:

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'

Dans tous les navigateurs modernes, vous pouvez utiliser

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

Voici le https MDN: / /developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart

Non que cette question a besoin d'autres réponses, mais je pensais que je voudrais ajouter la version simple de ce lodash.

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

La dernière façon de faire est beaucoup plus simple:

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

output: "02"

Juste une autre solution, mais je pense qu'il est plus lisible.

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

Celui-ci est moins native, mais peut-être le plus rapide ...

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

Ma solution

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

Utilisation

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

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

Pourquoi ne pas utiliser la récursivité?

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

Certains monkeypatching fonctionne aussi

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

... etc.

Vive

simple , la solution la plus directe vers l'avant, vous trouverez.

function zerofill(number,length) {
    var output = number.toString();
    while(output.length < length) {
      output = '0' + output;
    }
    return output;
}
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top