Cómo rellenar hasta una longitud en Javascript

Un comentario reciente en el post Cómo limitar decimales en Javascript preguntaba sobre cómo rellenar hasta una longitud en Javascript, bien, vamos a verlo a continuación bien sea con ceros o con otros carácteres.

Rellenar hasta una longitud

Hay cientos de modos de llegar a una solución, aquí comparto una que me parece sencilla:

function pad(input, length, padding) { 
  var str = input + "";
  return (length <= str.length) ? str : pad(str+padding, length, padding);
}

A la función pad() la invocamos con 3 parámetros:

• El número o cadena que queramos rellenar.
• La longitud final deseada
• El relleno: número(s), cadena(s), etc.

Ejemplo

var result = pad(1.5, 0, 4); // resultado = 1.50 
var result = pad('ey', 'X', 5); // resultado = 'eyXXX'

Bonus: rellenar decimales

Lo mismo que lo anterior, pero el primer parámetro no es el número entero, sino la parte decimal.

var number = 2.5; 
var str = number+""; 
var dot = str.lastIndexOf('.'); 
var isDecimal = dot != -1; 
var integer = isDecimal ? str.substr(0, dot) : str; 
var decimals = isDecimal ? str.substr(dot+1) : ""; 
decimals = pad(decimals, 2, 0); 
var result = integer + '.' + decimals; 
// result = '2.50'

Por supuesto, no hace falta hacerlo en tantas líneas, pero lo dejo así por facilidad de lectura.

Si preferimos tener el relleno de decimales en una sola función, aquí está una solución:

function fillDecimals(number, length) {
  function pad(input, length, padding) { 
    var str = input + "";
    return (length <= str.length) ? str : pad(str + padding, length, padding);
  }
  var str        = number+"";
  var dot        = str.lastIndexOf('.');
  var isDecimal  = dot != -1;
  var integer    = isDecimal ? str.substr(0, dot) : str;
  var decimals   = isDecimal ? str.substr(dot+1)  : "";
  decimals       = pad(decimals, length, 0);
  return integer + '.' + decimals;
}
 
fillDecimals(7, 2);   // resultado = '7.00'
fillDecimals(9.9, 2); // resultado = '9.90'

Deja un comentario con tu sugerencia o duda 🙂