published: 20 Jun 2022
2 min read
Capitalize the first letter of each word in a string using JavaScript
To capitalize the first letter of each word in a string using JavaScript:
- Use the
split()method to split the string into an array using whitespace as a delimiter. - Use the
map()method to iterate over the array elements. - Use the
slice()andcharAt()methods to capitalize each element of the array. - Use the
join()method to combine all the array elements to get the capitalized string.
const phrase = 'how to learn javascript'
const words = phrase.split(' ')
const capitalWords = words.map(str => {
return str.charAt(0).toUpperCase() + str.slice(1)
})
const capitalStr = capitalWords.join(' ')
console.log(capitalStr)
// How To Learn Javascript
Alternatively, you can capitalize all words in a string using the replace() method with a regular expression:
const phrase = 'how to learn javascript'
const capitalStr = phrase.replace(/\b\w/g, c => c.toUpperCase())
console.log(capitalStr)
// How To Learn Javascript
The regular expression matches the first letter of each word within the given string and transforms only that letter to uppercase.
If you want to capitalize all words of a paragraph on a web page, use the CSS text-transform property instead:
.capitalize {
text-transform: capitalize;
}
Now just add the capitalize class to your HTML paragraph element as shown below:
<p>Welcome to JavaScript tutorials!</p>
Are we missing something? Help us improve this article. Reach out to us.
Capitalize the first letter of each word in a string using JavaScript
To capitalize the first letter of each word in a string using JavaScript:
- Use the
split()method to split the string into an array using whitespace as a delimiter. - Use the
map()method to iterate over the array elements. - Use the
slice()andcharAt()methods to capitalize each element of the array. - Use the
join()method to combine all the array elements to get the capitalized string.
const phrase = 'how to learn javascript'
const words = phrase.split(' ')
const capitalWords = words.map(str => {
return str.charAt(0).toUpperCase() + str.slice(1)
})
const capitalStr = capitalWords.join(' ')
console.log(capitalStr)
// How To Learn Javascript
Alternatively, you can capitalize all words in a string using the replace() method with a regular expression:
const phrase = 'how to learn javascript'
const capitalStr = phrase.replace(/\b\w/g, c => c.toUpperCase())
console.log(capitalStr)
// How To Learn Javascript
The regular expression matches the first letter of each word within the given string and transforms only that letter to uppercase.
If you want to capitalize all words of a paragraph on a web page, use the CSS text-transform property instead:
.capitalize {
text-transform: capitalize;
}
Now just add the capitalize class to your HTML paragraph element as shown below:
<p>Welcome to JavaScript tutorials!</p>
Are you looking for other code tips?
JS Nooby
Javascript connoisseur
