String.prototype.padEnd()

The mirror of padStart, and the one you want for left-aligned columns. Same two rules: it never shortens, and a multi-character pad is cut to fit.

String methodES2017Live demo
Common call
label.padEnd(12)
Returns
a new string of at least the target length
Replaces
manual space concatenation in a loop
Watch out
trailing spaces are invisible and survive into your data
string.padEnd(targetLength[, padString])
→ string

Demo

Live evaluation
Try:
Inputs
sstringthe string to pad
lengthnumbertarget length
padstringpad text
Output
'name'.padEnd(10, ' ')
'name '

The quotes around the output matter here — trailing spaces are otherwise invisible, and they are exactly what this method adds. A dot leader shows that the pad need not be whitespace at all. The third case is the shared rule with padStart: a string longer than the target comes back unchanged, so this cannot enforce a column width on its own. The multi-character pad repeats then gets cut, so 'ab' to length 5 gives 'xabab'.

Parameters

NameTypeRequiredDescription
targetLengthnumberyesDesired final length. At or below the current length, nothing happens.
padStringstringno (' ')Text to pad with, repeated and truncated to fit exactly. An empty pad string does nothing.

Return value

string — A new string of at least targetLength, padded on the RIGHT. Like padStart it never truncates.

Common patterns

Align a column of labels
Only meaningful in a monospaced context.
rows.forEach(r => console.log(r.name.padEnd(16) + r.value));
Dot leader
A table of contents look, in plain text.
title.padEnd(40, '.') + page;
Bound the width both ways
padEnd never truncates, so slice first.
const cell = s.slice(0, 16).padEnd(16);

Examples

1. Space padded
'name'.padEnd(8)
Returns
'name '
2. Dot leader
'ch'.padEnd(6, '.')
Returns
'ch....'
3. Already longer
'abcdef'.padEnd(3)
Returns
'abcdef'
4. Multi-char, cut
'x'.padEnd(5, 'ab')
Returns
'xabab'
5. padStart mirrors it
'x'.padStart(5, 'ab')
Returns
'ababx'
6. Empty pad
'x'.padEnd(5, '')
Returns
'x'

Pitfalls

1. Trailing whitespace is invisible and persistent
Padding a value for display and then storing or comparing it is a classic source of bafflement — two strings that look identical differ, because one carries eight spaces nobody can see. Pad at the point of output, never before saving.
Not equal
'a'.padEnd(4) === 'a'
false
Trim before comparing
'a'.padEnd(4).trim() === 'a'
true
2. It never truncates
Identical to padStart. A long value simply breaks the column rather than being cut, so any fixed-width layout needs a slice as well.
Column breaks
'a very long value'.padEnd(8)
length 17
Slice first
'a very long value'.slice(0, 8).padEnd(8)
'a very l'
3. Spaces collapse in HTML
Padding for alignment only works where whitespace is significant — a terminal, a pre block, a log file. In ordinary HTML the run of spaces collapses to one and the alignment vanishes.
No effect
div.textContent = 'a'.padEnd(10) + 'b'
renders as 'a b'
CSS or a table
display: grid
real columns
4. It only works on strings
As with padStart, numbers have no pad method. Convert first.
Not a function
(5).padEnd(3)
TypeError: 5.padEnd is not a function
Convert first
String(5).padEnd(3)
'5 '

When to use

Use it
  • Left-aligned columns in logs, terminals or pre blocks
  • Dot leaders and other plain-text decoration
  • Fixed-width record formats
Reach for something else
  • Padding numbers on the left → padStart
  • Aligning in HTML → CSS grid, flex or a table
  • You need a maximum width → slice first
  • The value will be stored or compared → pad only at output

Notes

Complexity
O(targetLength)
Return
A new string, or the original when no padding is needed
CPython impl
V8: Builtins-string-pad
Memory
Allocates the padded result
Thread-safe
Single-threaded; the string is only read

FAQ

padEnd for text you want left-aligned — labels, names, anything read left to right. padStart for numbers, which align on their right-hand digit, and for zero-padded identifiers.

name.padEnd(12);              // 'Alice       '
String(n).padStart(4, '0');   // '0042'

History

ES2017
Added together with padStart.