Convert Text to Title Case in JavaScript
1
min read .
Updated on
A simple title-case helper can make labels, headings, and generated display text easier to read.
Basic Helper
function titleCase(text) {
return text
.toLowerCase()
.split(/\s+/)
.filter(Boolean)
.map((word) => word.charAt(0).toUpperCase() + word.slice(1))
.join(' ');
}Examples:
console.log(titleCase('hello world')); // Hello World
console.log(titleCase('javascript is awesome')); // Javascript Is Awesome
console.log(titleCase(' extra spaces ')); // Extra Spaces
What This Function Does
- Converts the input to lowercase.
- Splits it into words on whitespace.
- Capitalizes the first character of each word.
- Joins the words with a single space.
Title Case Is Language-Dependent
Real editorial title case can be more complicated. Rules may keep short words such as “and”, “of”, or “the” lowercase, preserve acronyms, or follow language-specific capitalization conventions.
For user names and arbitrary international text, automatically forcing title case can also produce incorrect results. Use this helper when the formatting rule is appropriate for the data you control.
Conclusion
For simple UI labels or normalized headings, a small titleCase function is often enough. For publishing workflows or multilingual text, use explicit editorial rules rather than assuming every word should be capitalized the same way.