Desarrollando con padStart() en JavaScript

12 julio, 2025 Arkkan

Una guía práctica para programadores intermedios

padStart() es una función de cadena en JavaScript que se utiliza para asegurarse de que un texto tenga una longitud específica. Esta función es especialmente útil cuando se trabaja con cadenas de caracteres y se necesita garantizar que todas las cadenas tengan la misma longitud. padStart() toma tres parámetros: el primer parámetro es el carácter o cadena de caracteres que se agregará al final de la cadena si es necesario, el segundo parámetro es el número mínimo de caracteres que debe tener la cadena y el tercero es un bandera opcional que indica el tipo de relleno a utilizar.

Ejemplo 1: Añadir ceros a la izquierda de un número


// Número
const numero = 12;

// Longitud deseada
const longitudDeseada = 4;

// Uso de padStart()
const resultado = numero.toString().padStart(longitudDeseada, '0');
console.log(resultado); // "0012"

padStart() se utiliza aquí para asegurarse de que el número tenga una longitud de cuatro dígitos, añadiendo ceros en la izquierda si es necesario.

Ejemplo 2: Asegurar el formato de fecha


// Fecha
const fecha = new Date();
const dia = fecha.getDate().toString();
const mes = (fecha.getMonth() + 1).toString();
const anyo = fecha.getFullYear().toString();

// Longitud deseada para cada componente de la fecha
const longitudDiaDeseada = 2;
const longitudMesDeseada = 2;
const longitudAnyoDeseada = 4;

// Uso de padStart()
const formateada = `${dia.padStart(longitudDiaDeseada, '0')}/${mes.padStart(longitudMesDeseada, '0')}/${anyo.padStart(longitudAnyoDeseada, '0')}`;
console.log(formateada); // "26/05/2021"

padStart() se utiliza aquí para asegurarse de que cada componente de la fecha tenga una longitud deseada, añadiendo ceros en la izquierda si es necesario.

Ejemplo 3: Ordenar una cadena alfabéticamente


const palabra = 'JavaScript';

// Longitud deseada
const longitudDeseada = 5;

// Uso de padStart()
const resultado = palabra.slice(0, longitudDeseada).padStart(longitudDeseada, 'X');
console.log(resultado); // "JavXS"

padStart() se utiliza aquí para asegurarse de que la cadena tenga una longitud deseada, rellenando con un carácter específico en este caso, ‘X’.

Ejemplo 4: Añadir prefijos o sufijos a cadenas


const nombre = 'John';

// Prefijo deseado
const prefijoDeseado = 'Mr. ';

// Longitud deseada
const longitudDeseada = 10;

// Uso de padStart()
const resultado = prefijoDeseado + nombre.padStart(longitudDeseada, '');
console.log(resultado); // "Mr. John"

padStart() se utiliza aquí para asegurarse de que la cadena tenga una longitud deseada, añadiendo un prefijo en este caso, ‘Mr. ‘, si es necesario.

Ejemplo 5: Ordenar un array alfabéticamente


const frutas = ['Banana', 'Manzana', 'Naranja'];

// Ordenar alfabéticamente
frutas.sort();

// Longitud deseada
const longitudDeseada = 6;

// Uso de padStart()
frutas.forEach((fruta, index) => {
  frutas[index] = fruta.padStart(longitudDeseada, 'X');
});
console.log(frutas); // ["BanaXA", "ManzaXA", "NaraXA"]

padStart() se utiliza aquí para asegurarse de que cada elemento del array tenga una longitud deseada, rellenando con un carácter específico en este caso, ‘X’.

Conclusión

padStart() es una función útil en JavaScript para garantizar que todas las cadenas tengan la misma longitud. Al usar esta función, puedes evitar problemas de compatibilidad y errores de programación al trabajar con cadenas de caracteres. Para integrarla en proyectos futuros, te recomendamos que comiences por practicar con ejemplos simples y luego avances a proyectos más complejos. También puedes utilizar herramientas de desarrollo como MDN Web Docs para aprender más sobre esta función y otras funciones útiles en JavaScript.