Como usar String.prototype.padEnd() no JavaScript

O método String.prototype.padEnd() permite preencher uma string com um determinado caractere (ou conjunto de caracteres) no final, até que ela atinja um comprimento desejado.

Por que isso é útil?

Imagine que você precise alinhar textos ou números para exibição em tabelas, relatórios ou telas de terminal. Em vez de concatenar manualmente espaços, padEnd() faz isso de forma nativa e elegante.

Sintaxe do padEnd()

str.padEnd(targetLength, padString)

• targetLength: comprimento final desejado da string.
• padString (opcional): caracteres usados para preencher. Se omitido, será usado um espaço " ".

Exemplo básico

const nome = "Luigi";
console.log(nome.padEnd(10, '.'));
// Saída: "Luigi....."

const nome = "Luigi";
console.log(nome.padEnd(10, '.'));
// Saída: "Luigi....."

Exemplo prático

Digamos que você precise alinhar códigos de produtos para gerar uma listagem legível:

const produtos = [
  { nome: "Caneta", codigo: "1" },
  { nome: "Caderno", codigo: "23" },
  { nome: "Lápis", codigo: "456" }
];

produtos.forEach(p => {
  console.log(`${p.codigo.padEnd(5, ' ')} | ${p.nome}`);
});

const produtos = [
  { nome: "Caneta", codigo: "1" },
  { nome: "Caderno", codigo: "23" },
  { nome: "Lápis", codigo: "456" }
];

produtos.forEach(p => {
  console.log(`${p.codigo.padEnd(5, ' ')} | ${p.nome}`);
});

Saída:

1     | Caneta
23    | Caderno
456   | Lápis

1     | Caneta
23    | Caderno
456   | Lápis

Conclusão

padEnd() é um método simples, mas muito útil para formatar strings com clareza e consistência, especialmente quando você precisa alinhar informações textuais.

Referências:

• MDN Web Docs — padEnd

Posts relacionados:

padStart() no JavaScript: Formatando strings com elegância Dominando os Tipos Utilitários do TypeScript: Partial, Pick, Omit, Record e mais Como Funciona o Server-Side Rendering no Remix.run (e por que ele é diferente) O que é Remix.run e por que você deveria usar