toUpperCase()

ES3+

Returns a new string with every character converted to uppercase according to the Unicode default case mappings; the original string is unchanged. Characters without an uppercase form pass through as-is, and a few mappings expand the string, most famously the German sharp s becoming SS. For language-specific behavior, use toLocaleUpperCase().

Syntax

string.toUpperCase()

Return Value

string

A new string representing the original string in upper case

Examples

JavaScript

const str = 'Hello World';
console.log(str.toUpperCase());

Output:

// 'HELLO WORLD'

📌 When to Use

Use toUpperCase() when output or comparison demands capital letters: formatting ISO country, currency, and airport codes, normalizing SKUs, coupon codes, and license plates, generating CONSTANT_CASE identifiers, or making headings and badges visually uniform when CSS text-transform is not an option, such as in emails, logs, or plain-text exports. It is also a fine normalizer for case-insensitive comparison, though the JavaScript convention leans toward lowercasing for that job; what matters is that your codebase picks one direction and uses it everywhere, because mixing directions creates comparisons that never match. Like its counterpart, toUpperCase() applies locale-independent Unicode default mappings: accented letters, Greek, and Cyrillic uppercase correctly, while digits, punctuation, and caseless scripts pass through. Prefer toLocaleUpperCase with an explicit locale when handling user text in Turkish or Azerbaijani, where the lowercase i must uppercase to a dotted capital I, or in Greek, where some engines apply special accent handling. For codes and identifiers, stick with plain toUpperCase() so behavior never varies with the runtime locale. One caution: uppercasing is not always reversible. The German sharp s uppercases to SS, and round-tripping back through toLowerCase() yields ss, a different string, so never treat case conversion as lossless.

⚠️ Common Mistakes

Discarding the result: toUpperCase() cannot modify the string in place because strings are immutable. Calling code.toUpperCase() without assigning the return value changes nothing, and the bug is easy to miss because no error is thrown.

Assuming the length never changes: the German sharp s (U+00DF) uppercases to the two-letter sequence SS, and certain ligatures and precomposed characters also expand. Index math done on the original string can be off after conversion, so recompute positions on the converted string.

Treating uppercasing as reversible: 'straße'.toUpperCase() gives 'STRASSE', and lowercasing that yields 'strasse', not the original. If you need the original later, keep it; never rely on a round-trip through case conversion.

Forgetting locale-sensitive letters: for Turkish text, the lowercase i must become a dotted capital I (U+0130), which plain toUpperCase() does not produce. User-facing Turkish or Azerbaijani text needs toLocaleUpperCase with the appropriate locale.

Normalizing one side of a comparison to uppercase and the other to lowercase: both sides must be converted in the same direction. This usually happens when two developers touch different ends of the same comparison, so centralize the normalization in one helper function.

Using toUpperCase() for presentation when CSS would do: hard-uppercasing display strings in JavaScript bakes the transformation into the data. In web UIs, text-transform: uppercase keeps the underlying text intact and is applied by the rendering engine for free.

✅ Best Practices

Normalize codes at the input boundary: uppercase country codes, currency codes, and SKUs once when they enter the system, so every later comparison and log line sees the canonical form.

Pick one case direction for case-insensitive comparison across your whole codebase, and wrap it in a small helper so the convention is enforced by construction rather than by review.

Use plain toUpperCase() for machine-facing identifiers and toLocaleUpperCase with an explicit locale for human-facing text, never toLocaleUpperCase without arguments, whose behavior silently follows the runtime environment locale.

In browser UIs, prefer CSS text-transform for purely visual capitalization and reserve toUpperCase() for data that must actually be stored or compared in capital form.

When building CONSTANT_CASE or slug-like identifiers, do the structural transformation first, such as inserting underscores at camelCase boundaries, and apply toUpperCase() as the final step, keeping each stage simple and testable.

⚡ Performance Notes

toUpperCase() is a linear scan that allocates a new string, with engines fast-pathing ASCII text and often returning the original object when the string is already fully uppercase. Individual calls are cheap; the cost appears when conversion is repeated needlessly, such as uppercasing the same lookup key inside a loop or uppercasing entire large texts when only a comparison of short prefixes was needed. Hoist conversions out of loops and store pre-normalized values for frequently compared fields. Because a few Unicode mappings expand the string, the engine cannot always predict the output length, but this has no practical performance impact. As with lowercasing, comparing two case-normalized strings with === is much faster than locale-aware comparison through Intl.Collator, so normalization remains the right approach for high-volume matching of codes and identifiers.

🌍 Real World Example

Formatting Codes and Identifiers

Three code-formatting utilities. formatCountryCode() canonicalizes user-entered values like 'us' or 'Kr' into the uppercase two-letter ISO form that payment and shipping APIs expect. toConstantCase() first inserts underscores at camelCase boundaries with a regex, converts spaces and hyphens to underscores, and only then applies toUpperCase(), turning 'backgroundColor' into 'BACKGROUND_COLOR'. formatProductCode() uppercases, strips every non-alphanumeric character, and regroups the result into dash-separated blocks of four, the familiar shape of license keys and voucher codes. All three normalize at the boundary so downstream comparisons can use plain strict equality.

// Format ISO country and currency codes
function formatCountryCode(code) {
  return code.toUpperCase().trim();
}

console.log(formatCountryCode('us'));  // 'US'
console.log(formatCountryCode('Kr'));  // 'KR'

// Create constant-style identifier from string
function toConstantCase(str) {
  return str
    .replace(/([a-z])([A-Z])/g, '$1_$2')
    .replace(/[\s-]+/g, '_')
    .toUpperCase();
}

console.log(toConstantCase('backgroundColor')); // 'BACKGROUND_COLOR'
console.log(toConstantCase('font-size'));       // 'FONT_SIZE'

// Format license plate or product code
function formatProductCode(code) {
  return code
    .toUpperCase()
    .replace(/[^A-Z0-9]/g, '')
    .replace(/(.{4})/g, '$1-')
    .slice(0, -1);  // Remove trailing dash
}

console.log(formatProductCode('abc123def456'));
// Output: 'ABC1-23DE-F456'

Related Methods

toLowerCase()