Existe uma function JavaScript que pode preencher uma string para chegar a um tamanho determinado?

Eu estou precisando de uma function JavaScript que pode ter um valor e preenchê-lo para um determinado comprimento (eu preciso de espaços, mas qualquer coisa faria). Eu achei isto:

Código:

String.prototype.pad = function(l, s, t){ return s || (s = " "), (l -= this.length) > 0 ? (s = new Array(Math.ceil(l / s.length) + 1).join(s)).substr(0, t = !t ? l : t == 1 ? 0 : Math.ceil(l / 2)) + this + s.substr(0, l - t) : this; }; 

Exemplo:

  //<![CDATA[ var s = "Jonas"; document.write( '

S = '.bold(), s, "

", 'S.pad(20, "[]", 0) = '.bold(), s.pad(20, "[]", 0), "
", 'S.pad(20, "[====]", 1) = '.bold(), s.pad(20, "[====]", 1), "
", 'S.pad(20, "~", 2) = '.bold(), s.pad(20, "~", 2) ); //]]>

Mas eu não tenho ideia do que está fazendo e não parece funcionar para mim.

Eu encontrei esta solução aqui e isso é para mim muito mais simples:

 var n = 123 String("00000" + n).slice(-5); // returns 00123 ("00000" + n).slice(-5); // returns 00123 (" " + n).slice(-5); // returns " 123" (with two spaces) 

E aqui eu fiz uma extensão para o object string:

 String.prototype.paddingLeft = function (paddingValue) { return String(paddingValue + this).slice(-paddingValue.length); }; 

Um exemplo para usá-lo:

 function getFormattedTime(date) { var hours = date.getHours(); var minutes = date.getMinutes(); hours = hours.toString().paddingLeft("00"); minutes = minutes.toString().paddingLeft("00"); return "{0}:{1}".format(hours, minutes); }; String.prototype.format = function () { var args = arguments; return this.replace(/{(\d+)}/g, function (match, number) { return typeof args[number] != 'undefined' ? args[number] : match; }); }; 

Isso retornará uma hora no formato “15:30”

Um método mais rápido

Se você estiver fazendo isso repetidamente, por exemplo, para preencher valores em uma matriz e o desempenho for um fator, a abordagem a seguir pode fornecer uma vantagem quase 100 vezes maior em velocidade ( jsPerf ) em relação a outras soluções que são discutidas atualmente nas interwebs . A idéia básica é que você está fornecendo a function pad com uma string vazia totalmente preenchida para usar como um buffer. A function pad apenas anexa a string para ser adicionada a essa string pré-preenchida (uma concat de string) e então corta ou apara o resultado no comprimento desejado.

 function pad(pad, str, padLeft) { if (typeof str === 'undefined') return pad; if (padLeft) { return (pad + str).slice(-pad.length); } else { return (str + pad).substring(0, pad.length); } } 

Por exemplo, para zerar um número em um comprimento de 10 dígitos,

 pad('0000000000',123,true); 

Para preencher uma string com espaço em branco, a string inteira é de 255 caracteres,

 var padding = Array(256).join(' '), // make a string of 255 spaces pad(padding,123,true); 

Teste de performance

Veja o teste jsPerf aqui .

E isso é mais rápido que o ES6 string.repeat por 2x também, como mostrado pela revista JsPerf aqui

http://www.webtoolkit.info/javascript_pad.html

 /** * * Javascript string pad * http://www.webtoolkit.info/ * **/ var STR_PAD_LEFT = 1; var STR_PAD_RIGHT = 2; var STR_PAD_BOTH = 3; function pad(str, len, pad, dir) { if (typeof(len) == "undefined") { var len = 0; } if (typeof(pad) == "undefined") { var pad = ' '; } if (typeof(dir) == "undefined") { var dir = STR_PAD_RIGHT; } if (len + 1 >= str.length) { switch (dir){ case STR_PAD_LEFT: str = Array(len + 1 - str.length).join(pad) + str; break; case STR_PAD_BOTH: var right = Math.ceil((padlen = len - str.length) / 2); var left = padlen - right; str = Array(left+1).join(pad) + str + Array(right+1).join(pad); break; default: str = str + Array(len + 1 - str.length).join(pad); break; } // switch } return str; } 

É muito mais legível.

Aqui está uma abordagem recursiva para isso.

 function pad(width, string, padding) { return (width <= string.length) ? string : pad(width, padding + string, padding) } 

Um exemplo...

 pad(5, 'hi', '0') => "000hi" 

Usando o método ECMAScript 6 String # repeat , uma function pad é tão simples quanto:

 String.prototype.padLeft = function(char, length) { return char.repeat(Math.max(0, length - this.length)) + this; } 

Atualmente, a String#repeat é suportada apenas no Firefox e no Chrome. para outra implementação, pode-se considerar o seguinte polyfill simples:

 String.prototype.repeat = String.prototype.repeat || function(n){ return n<=1 ? this : (this + this.repeat(n-1)); } 

String.prototype.padStart() e String.prototype.padEnd() são propostas candidatas a TC39 atualmente: consulte github.com/tc39/proposal-string-pad-start-end (disponível apenas no Firefox a partir de abril de 2016; um polyfill é acessível).

O truque chave em ambas as soluções é criar uma instância de array com um determinado tamanho (um a mais que o comprimento desejado) e, em seguida, chamar imediatamente o método join() para criar uma string . O método join() é passado pela string preenchimento (espaços provavelmente). Como a array está vazia, as células vazias serão renderizadas como strings vazias durante o processo de unir a array em uma string resultados e apenas o preenchimento permanecerá. É uma técnica muito legal.

O ECMAScript 2017 adiciona um método padStart ao protótipo String. Este método irá preencher uma string com espaços para um determinado comprimento. Esse método também usa uma sequência opcional que será usada em vez de espaços para preenchimento.

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

Um método padEnd também foi adicionado e funciona da mesma maneira.

Para compatibilidade com navegadores (e um polyfill útil), veja este link .

Usando o método ECMAScript 6 String # repeat e Arrow funções , uma function pad é tão simples como:

 var leftPad = (s, c, n) => c.repeat(n - s.length) + s; leftPad("foo", "0", 5); //returns "00foo" 

jsfiddle

edit: sugestão dos comentários:

 const leftPad = (s, c, n) => n - s.length > 0 ? c.repeat(n - s.length) + s : s; 

Desta forma, ele não lançará um erro quando s.length for maior que n

edit2: sugestão dos comentários:

 const leftPad = (s, c, n) =>{ s = s.toString(); c = c.toString(); return s.length > n ? s : c.repeat(n - s.length) + s; } 

Desta forma, você pode usar a function para strings e não-strings iguais.

pad com valores padrão

Eu notei que eu principalmente preciso do padLeft para conversão de tempo / preenchimento do número

então eu escrevi essa function

 function padL(a,b,c){//string/number,length=2,char=0 return (new Array(b||2).join(c||0)+a).slice(-b) } 

Esta function simples suporta Number ou String como input

pad padrão é de 2 caracteres

o caractere padrão é 0

então eu posso simplesmente escrever

 padL(1); // 01 

se eu adicionar o segundo argumento (largura da almofada)

 padL(1,3); // 001 

terceiro parâmetro (pad char)

 padL('zzz',10,'x'); // xxxxxxxzzz 

EDIT @BananaAcid se você passar um valor indefinido ou uma string de comprimento 0 você obtém 0undefined :

como sugerido

 function padL(a,b,c){//string/number,length=2,char=0 return (new Array((b||1)+1).join(c||0)+(a||'')).slice(-(b||2)) } 

mas isso também pode ser alcançado de maneira mais curta.

 function padL(a,b,c){//string/number,length=2,char=0 return (new Array(b||2).join(c||0)+(a||c||0)).slice(-b) } 

funciona também com:

 padL(0) padL(NaN) padL('') padL(undefined) padL(false) 

E se você quiser ser capaz de preencher os dois lados:

 function pad(a,b,c,d){//string/number,length=2,char=0,0/false=Left-1/true=Right return a=(a||c||0),c=new Array(b||2).join(c||0),d?(a+c).slice(0,b):(c+a).slice(-b) } 

que pode ser escrito de forma mais curta sem usar fatia.

 function pad(a,b,c,d){ return a=(a||c||0)+'',b=new Array((++b||3)-a.length).join(c||0),d?a+b:b+a } /* Usage: pad( input // (int or string) or undefined,NaN,false,empty string // default:0 or PadCharacter // optional ,PadLength // (int) default:2 ,PadCharacter // (string or int) default:'0' ,PadDirection // (bolean) default:0 (padLeft) - (true or 1) is padRight ) */ 

Agora, se você tentar pad ‘averylongword’ com 2 … isso não é problema meu.


Disse que eu te dou uma dica.

Na maioria das vezes, se você o fizer, faça o mesmo valor N vezes.

Usando qualquer tipo de function dentro de um loop desacelera o loop !!!

Então, se você quer apenas deixar alguns números dentro de uma longa lista, não use funções para fazer essa coisa simples.

use algo assim:

 var arrayOfNumbers=[1,2,3,4,5,6,7], paddedArray=[], len=arrayOfNumbers.length; while(len--){ paddedArray[len]=('0000'+arrayOfNumbers[len]).slice(-4); } 

se você não sabe como o tamanho máximo de preenchimento é baseado nos números dentro da matriz.

 var arrayOfNumbers=[1,2,3,4,5,6,7,49095], paddedArray=[], len=arrayOfNumbers.length; // search the highest number var arrayMax=Function.prototype.apply.bind(Math.max,null), // get that string length padSize=(arrayMax(arrayOfNumbers)+'').length, // create a Padding string padStr=new Array(padSize).join(0); // and after you have all this static values cached start the loop. while(len--){ paddedArray[len]=(padStr+arrayOfNumbers[len]).slice(-padSize);//substr(-padSize) } console.log(paddedArray); /* 0: "00001" 1: "00002" 2: "00003" 3: "00004" 4: "00005" 5: "00006" 6: "00007" 7: "49095" */ 

Aqui está uma function simples que eu uso.

 var pad=function(num,field){ var n = '' + num; var w = n.length; var l = field.length; var pad = w < l ? lw : 0; return field.substr(0,pad) + n; }; 

Por exemplo:

 pad (20,' '); // 20 pad (321,' '); // 321 pad (12345,' '); //12345 pad ( 15,'00000'); //00015 pad ( 999,'*****'); //**999 pad ('cat','_____'); //__cat 

Um caminho curto:

 (x=>(new Array(int-x.length+1)).join(char)+x)(String) 

Exemplo:

 (x=>(new Array(6-x.length+1)).join("0")+x)("1234") 

devolução: “001234”

Pegando as idéias de Samuel, para cima aqui. E lembre-se de um script SQL antigo, eu tentei com isso:

 a=1234; '0000'.slice(a.toString().length)+a; 

Funciona em todos os casos que eu possa imaginar:

 a= 1 result 0001 a= 12 result 0012 a= 123 result 0123 a= 1234 result 1234 a= 12345 result 12345 a= '12' result 0012 

es7 é apenas rascunhos e propostas agora, mas se você quisesse acompanhar a compatibilidade com as especificações, suas funções de pads precisam:

  1. Suporte de pad multi-caractere.
  2. Não trunque a string de input
  3. Pad padrão para o espaço

Da minha biblioteca de polyfill, mas aplique sua própria diligência para extensões de protótipo.

 // Tests 'hello'.lpad(4) === 'hello' 'hello'.rpad(4) === 'hello' 'hello'.lpad(10) === ' hello' 'hello'.rpad(10) === 'hello ' 'hello'.lpad(10, '1234') === '41234hello' 'hello'.rpad(10, '1234') === 'hello12341' String.prototype.lpad || (String.prototype.lpad = function( length, pad ) { if( length < this.length ) return this; pad = pad || ' '; let str = this; while( str.length < length ) { str = pad + str; } return str.substr( -length ); }); String.prototype.rpad || (String.prototype.rpad = function( length, pad ) { if( length < this.length ) return this; pad = pad || ' '; let str = this; while( str.length < length ) { str += pad; } return str.substr( 0, length ); }); 

Aqui está uma resposta simples em basicamente uma linha de código.

 var value = 35 // the numerical value var x = 5 // the minimum length of the string var padded = ("00000" + value).substr(-x); 

Certifique-se de que o número de caracteres em seu preenchimento, zeros aqui, seja pelo menos o tamanho mínimo pretendido. Então, realmente, para colocá-lo em uma linha, para obter um resultado de “00035”, neste caso, é:

 var padded = ("00000" + 35).substr(-5); 

A string de preenchimento foi implementada na nova versão do javascript.

str.padStart(targetLength [, padString])

https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/String/padStart

Se você quiser sua própria function, verifique este exemplo:

 const myString = 'Welcome to my house'; String.prototype.padLeft = function(times = 0, str = ' ') { return (Array(times).join(str) + this); } console.log(myString.padLeft(12, ':')); //:::::::::::Welcome to my house 

As manipulações de array são muito lentas em comparação com a concatenação de strings simples. Claro, benchmark para o seu caso de uso.

 function(string, length, pad_char, append) { string = string.toString(); length = parseInt(length) || 1; pad_char = pad_char || ' '; while (string.length < length) { string = append ? string+pad_char : pad_char+string; } return string; }; 

Uma variante da resposta do @Daniel LaFavers .

 var mask = function (background, foreground) { bg = (new String(background)); fg = (new String(foreground)); bgl = bg.length; fgl = fg.length; bgs = bg.substring(0, Math.max(0, bgl - fgl)); fgs = fg.substring(Math.max(0, fgl - bgl)); return bgs + fgs; }; 

Por exemplo:

 mask('00000', 11 ); // '00011' mask('00011','00' ); // '00000' mask( 2 , 3 ); // '3' mask('0' ,'111'); // '1' mask('fork' ,'***'); // 'f***' mask('_____','dog'); // '__dog' 

É 2014, e eu sugiro uma function de preenchimento de string Javascript. Ha!

Bare-bones: right-pad com espaços

 function pad ( str, length ) { var padding = ( new Array( Math.max( length - str.length + 1, 0 ) ) ).join( " " ); return str + padding; } 

Fantasia: pad com opções

 /** * @param {*} str input string, or any other type (will be converted to string) * @param {number} length desired length to pad the string to * @param {Object} [opts] * @param {string} [opts.padWith=" "] char to use for padding * @param {boolean} [opts.padLeft=false] whether to pad on the left * @param {boolean} [opts.collapseEmpty=false] whether to return an empty string if the input was empty * @returns {string} */ function pad ( str, length, opts ) { var padding = ( new Array( Math.max( length - ( str + "" ).length + 1, 0 ) ) ).join( opts && opts.padWith || " " ), collapse = opts && opts.collapseEmpty && !( str + "" ).length; return collapse ? "" : opts && opts.padLeft ? padding + str : str + padding; } 

Uso (fantasia):

 pad( "123", 5 ); // returns "123 " pad( 123, 5 ); // returns "123 " - non-string input pad( "123", 5, { padWith: "0", padLeft: true } ); // returns "00123" pad( "", 5 ); // returns " " pad( "", 5, { collapseEmpty: true } ); // returns "" pad( "1234567", 5 ); // returns "1234567" 

Eu acho que é melhor evitar a recursion porque é caro.

 function padLeft(str,size,padwith) { if(size <= str.length) { // not padding is required. return str; } else { // 1- take array of size equal to number of padding char + 1. suppose if string is 55 and we want 00055 it means we have 3 padding char so array size should be 3 + 1 (+1 will explain below) // 2- now join this array with provided padding char (padwith) or default one ('0'). so it will produce '000' // 3- now append '000' with orginal string (str = 55), will produce 00055 // why +1 in size of array? // it is a trick, that we are joining an array of empty element with '0' (in our case) // if we want to join items with '0' then we should have at least 2 items in the array to get joined (array with single item doesn't need to get joined). // 000 to get 3 zero we need 4 (3+1) items in array return Array(size-str.length+1).join(padwith||'0')+str } } alert(padLeft("59",5) + "\n" + padLeft("659",5) + "\n" + padLeft("5919",5) + "\n" + padLeft("59879",5) + "\n" + padLeft("5437899",5)); 

Aqui está uma function JavaScript que adiciona o número especificado de preenchimentos com symble personalizado. a function leva três parâmetros.

     padMe -> string ou número para a esquerda
     pads -> número de pads
     padSymble -> symble personalizado, o padrão é "0" 

  function leftPad(padMe, pads, padSymble) { if( typeof padMe === "undefined") { padMe = ""; } if (typeof pads === "undefined") { pads = 0; } if (typeof padSymble === "undefined") { padSymble = "0"; } var symble = ""; var result = []; for(var i=0; i < pads ; i++) { symble += padSymble; } var length = symble.length - padMe.toString().length; result = symble.substring(0, length); return result.concat(padMe.toString()); } 
 / * Aqui estão alguns resultados:

 > leftPad (1)
 "1"
 > leftPad (1, 4)
 "0001"
 > leftPad (1, 4, "0")
 "0001"
 > leftPad (1, 4, "@")
 "@@@ 1"

 * /
 /************************************************************************************************** Pad a string to pad_length fillig it with pad_char. By default the function performs a left pad, unless pad_right is set to true. If the value of pad_length is negative, less than, or equal to the length of the input string, no padding takes place. **************************************************************************************************/ if(!String.prototype.pad) String.prototype.pad = function(pad_char, pad_length, pad_right) { var result = this; if( (typeof pad_char === 'string') && (pad_char.length === 1) && (pad_length > this.length) ) { var padding = new Array(pad_length - this.length + 1).join(pad_char); //thanks to http://stackoverflow.com/questions/202605/repeat-string-javascript/2433358#2433358 result = (pad_right ? result + padding : padding + result); } return result; } 

E então você pode fazer:

 alert( "3".pad("0", 3) ); //shows "003" alert( "hi".pad(" ", 3) ); //shows " hi" alert( "hi".pad(" ", 3, true) ); //shows "hi " 

Se você quer apenas um one-liner hacky muito simples para pad, basta fazer uma string com o caractere de preenchimento desejado do comprimento máximo de preenchimento desejado e, em seguida, substring-lo para o comprimento do que você deseja preencher.

Exemplo: preenchendo o armazenamento de strings em e com espaços de 25 caracteres.

 var e = "hello"; e = e + " ".substring(e.length) 

Resultado: "hello "

Se você quiser fazer o mesmo com um número como input, apenas chame .toString() antes.

Se você não se importar em include uma biblioteca de utilitários, a biblioteca lodash possui as funções _.pad, _.padLeft e _.padRight .

Um amigo perguntou sobre o uso de uma function JavaScript para a esquerda. Transformou-se em um pouco de esforço entre alguns de nós no chat para codificá-lo. Este foi o resultado:

 function l(p,t,v){ v+="";return v.length>=t?v:l(p,t,p+v); } 

Isso garante que o valor a ser preenchido seja uma string e, se não for o comprimento total desejado, ele será preenchido uma vez e, em seguida, será recursado. Aqui está o que parece com mais nomeação e estrutura lógica

 function padLeft(pad, totalLength, value){ value = value.toString(); if( value.length >= totalLength ){ return value; }else{ return padLeft(pad, totalLength, pad + value); } } 

O exemplo que estávamos usando era garantir que os números fossem preenchidos com 0 à esquerda para obter um comprimento máximo de 6. Aqui está um exemplo:

 function l(p,t,v){v+="";return v.length>=t?v:l(p,t,p+v);} var vals = [6451,123,466750]; var pad = l(0,6,vals[0]);// pad with 0's, max length 6 var pads = vals.map(function(i){ return l(0,6,i) }); document.write(pads.join("
"));
  1. Nunca insira dados em algum lugar (especialmente não no início, como str = pad + str; ), pois os dados serão realocados toda vez. Anexar sempre no final!
  2. Não coloque sua corda no laço. Deixe-o em paz e construa primeiro sua string pad. No final concatene-o com sua string principal.
  3. Não atribua strings de preenchimento a cada vez (como str += pad; ). É muito mais rápido append a string de preenchimento a si mesma e extrair os primeiros x-chars (o analisador pode fazer isso de maneira eficiente se você extrair do primeiro caractere). Este é um crescimento exponencial, o que significa que ele desperdiça alguma memory temporariamente (você não deve fazer isso com textos extremamente grandes).
 if (!String.prototype.lpad) { String.prototype.lpad = function(pad, len) { while (pad.length < len) { pad += pad; } return pad.substr(0, len-this.length) + this; } } if (!String.prototype.rpad) { String.prototype.rpad = function(pad, len) { while (pad.length < len) { pad += pad; } return this + pad.substr(0, len-this.length); } } 

Aqui está o meu take

Não tenho tanta certeza sobre seu desempenho, mas acho muito mais legível do que outras opções que vi por aqui …

 var replicate = function(len, char) { return Array(len+1).join(char || ' '); }; var padr = function(text, len, char) { if (text.length >= len) return text; return text + replicate(len-text.length, char); }; 
 1. function var _padLeft = function(paddingString, width, replacementChar) { return paddingString.length >= width ? paddingString : _padLeft(replacementChar + paddingString, width, replacementChar || ' '); }; 2. String prototype String.prototype.padLeft = function(width, replacementChar) { return this.length >= width ? this.toString() : (replacementChar + this).padLeft(width, replacementChar || ' '); }; 3. slice ('00000' + paddingString).slice(-5) 

Com base nas melhores respostas desta questão eu fiz um protótipo para String chamado padLeft ( exatamente como temos em C # ):

 String.prototype.padLeft = function (paddingChar, totalWidth) { if (this.toString().length >= totalWidth) return this.toString(); var array = new Array(totalWidth); for (i = 0; i < array.length; i++) array[i] = paddingChar; return (array.join("") + this.toString()).slice(-array.length); } 

Uso:

 var str = "12345"; console.log(str.padLeft("0", 10)); //Result is: "0000012345" 

JsFiddle