The classic two-step uppercases the first character with charAt(0).toUpperCase() and concatenates slice(1) for the rest. Using charAt(0) over str[0] matters for the empty-string case because charAt returns '' whereas str[0] returns undefined, which would stringify to 'undefined' and break the output. This implementation runs in O(n) because slice copies the tail, but the constant factor is tiny and good enough for typical UI strings. Reach for it when you control the input and just need to fix one form label.

In a real codebase, the input often arrives from a form, an API response, or a JSON column where it can be null, undefined, or even a number. A tiny typeof plus length check turns those silent corruptions into a predictable empty string. Note that this version intentionally does not lowercase the rest of the input, so 'iPhone' stays 'IPhone'-style without mangling already-cased acronyms. Use this whenever the value comes from an unknown source you cannot fully trust.

str[0] and charAt(0) operate on UTF-16 code units, which silently splits surrogate pairs (any character outside the Basic Multilingual Plane) into two halves. Using codePointAt(0) plus String.fromCodePoint keeps the first user-perceived character intact, then slice(first.length) advances past either one or two code units depending on whether the head was a BMP character or a surrogate pair. The German ß example also shows that toUpperCase() can grow the string (one code point becomes 'SS'), so do not assume the output length matches the input. Pick this variant whenever your strings can contain non-ASCII content like accented Latin, Cyrillic, math italics, or emoji-adjacent symbols.

Title case is the natural extension: split on whitespace, capitalize each word, and join back with single spaces. The .toLowerCase() first pass normalises shouting input like 'BROWN' so it does not stay 'BROWN' after the per-word capitalize, and .filter(Boolean) removes the empty entries produced by runs of whitespace. This is deliberately ASCII-naive: locale-specific small words (English 'and', French 'de') are still capitalized, which is fine for most UI use but wrong for editorial style. For headlines or CMS titles, layer a stop-word list on top, but for table headers and labels this version is enough.