String.prototype.toUpperCase()

The mirror of toLowerCase, with one extra hazard: upper-casing can change the length of the string, which no amount of index arithmetic will survive.

String methodES1 (1997)Live demo
Common call
code.toUpperCase()
Returns
a new string — assign it
Replaces
nothing; it is the base method
Watch out
length can grow — ß becomes SS
string.toUpperCase()
→ string

Demo

Live evaluation
Try:
Inputs
sstringtext to uppercase
Output
'Hello World'.toUpperCase()
'HELLO WORLD'

The German ß is the case to look at: it upper-cases to two characters, SS, so 'straße' becomes seven letters from six. Any code that assumed a case conversion preserves length — a fixed-width field, an index calculated before the call — is wrong for this input. The Greek case is a second example of a many-to-one mapping: both the regular sigma and the word-final sigma ς map to the same capital Σ, so upper-casing Greek text is not reversible either.

Common patterns

Normalise a code or identifier
Upper case is conventional for country and currency codes.
const cc = input.trim().toUpperCase();
Capitalise the first letter only
toUpperCase on one character, then the rest.
const title = s.charAt(0).toUpperCase() + s.slice(1);
Shout for display
Prefer CSS — it keeps the underlying data intact.
text-transform: uppercase;

Examples

1. Mixed case
'Hello'.toUpperCase()
Returns
'HELLO'
2. ß expands
'\u00df'.toUpperCase()
Returns
'SS'
3. Length grows
'stra\u00dfe'.toUpperCase().length
Returns
7 // was 6
4. Not reversible
'\u00df'.toUpperCase().toLowerCase()
Returns
'ss'
5. Both sigmas merge
'\u03c3\u03c2'.toUpperCase()
Returns
'\u03a3\u03a3'
6. Turkish differs
'i'.toLocaleUpperCase('tr')
Returns
'\u0130' // dotted capital

Pitfalls

1. The result can be longer than the input
ß becomes SS, and several ligatures expand similarly. Code that upper-cases a value into a fixed-width field, or that reuses an index computed before the conversion, silently corrupts exactly the input it was least tested on.
Length changed
'stra\u00dfe'.length + ' -> ' + 'stra\u00dfe'.toUpperCase().length
'6 -> 7'
Recompute after
const upper = s.toUpperCase();
const n = upper.length;
correct
2. Case conversion is not reversible
Upper-casing then lower-casing does not return the original for ß, for the final Greek sigma, or for any other many-to-one mapping. Keep the original string if you need it; derive the folded form separately.
Lost
'\u00df'.toUpperCase().toLowerCase()
'ss'
Keep both
const display = original;
const key = original.toLowerCase();
original preserved
3. It returns a new string and changes nothing
Same rule as everywhere else in the string API.
Discarded
let s = 'abc';
s.toUpperCase();
s
'abc'
Assign it
let s = 'abc';
s = s.toUpperCase();
s
'ABC'
4. Upper-casing for display belongs in CSS
text-transform leaves the underlying value untouched, so copy-paste, form submission and screen readers all get the real text. Converting in JavaScript bakes the shouting into your data.
Data changed
input.value = input.value.toUpperCase()
the stored value is now uppercase
Style only
text-transform: uppercase
display only

When to use

Use it
  • Normalising codes that are conventionally upper case — currency, country, state
  • Capitalising a single leading character
  • Matching a protocol that specifies upper case
Reach for something else
  • Shouting for visual effect → text-transform in CSS
  • Case-insensitive comparison → toLowerCase is the conventional direction
  • Text the user reads → toLocaleUpperCase with their locale
  • You rely on the length staying the same → it does not

Notes

Complexity
O(n)
Return
A new string, possibly of a different length
CPython impl
V8: Builtins-string-touppercase / ICU
Memory
Allocates the result
Thread-safe
Single-threaded; the string is only read

FAQ

Because there was no capital ß in standard German orthography when the Unicode mappings were written, so the defined upper-case form of ß is the two-letter SS. A capital ẞ was later encoded, but the default mapping was not changed — it would break existing text.

'stra\u00dfe'.toUpperCase();   // 'STRASSE'

History

ES1
toUpperCase present from the first version of the language.
ES3
toLocaleUpperCase added for locale-sensitive mapping.
ES2017
The locale variants gained an explicit locale argument.