This tutorial is out of date and no longer maintained.
This one’s easy and probably already something you already know about. To capitalize an entire string, simply call
.toUpperCase() on the string:
let myString = 'alligator'; myString.toUpperCase();
Which will convert the lower case string to the upper case,
This can even work on mixed case strings as well:
myString = 'AlliGator'; myString.toUpperCase();
Same result, the string becomes
Okay, so that first one was easy and things are about to get significantly more complex really quickly.
Because there isn’t a built in method on the
String prototype to upper case just the first letter of the string, we have to get a bit creative.
The gist of things is that we are going to need to grab the very first letter of the string, capitalize it, then grab the rest of the string, and re-assemble things.
Fortunately, we don’t have to walk through each of those steps and can just use a regular expression to grab the first letter and capitalize it, returning the modified string:
myString = 'the quick green alligator...'; myString.replace(/^\w/, (c) => c.toUpperCase());
This will result in the string becoming
The quick green alligator....
This is great as long as your string doesn’t have any spaces padding the front of it.
If you aren’t sure if you are going to encounter said padding, like when you’re dealing with the inconsistencies of user-generated content, you can include the
.trim() method to clean things up before capitalizing:
myString = ' the quick green alligator...'; myString.trim().replace(/^\w/, (c) => c.toUpperCase());
We also need to take a similar approach, the string needs to be broken into words, each word needs to be capitalized and then reassembled with spaces in between them.
We could approach this by using
.join() with our capitalization regular expression from earlier sandwiched in between.
Or, we could approach it by simply adding another regular expression to the mix:
myString = 'the quick green alligator...'; myString.replace(/\w\S*/g, (w) => (w.replace(/^\w/, (c) => c.toUpperCase())));
Will give us
The Quick Green Alligator....
Because we’re isolating the words themselves, this method is a bit more fault tolerant when it comes to proceeding spacing. You may still want to
trim() the string though, if you don’t want said padding in the resulting string.
If you’re working with a string that has words that are MiXeD CaSe, you may also want to include a call to
.toLowerCase() to make things consistent.
myString = ' tHE QuICk GrEEn alliGATOR... '; myString.trim().toLowerCase().replace(/\w\S*/g, (w) => (w.replace(/^\w/, (c) => c.toUpperCase())));
Still gets us
The Quick Green Alligator....
Granted, this will also lower case any acronyms in the string, so your mileage may vary!
If you’ve enjoyed this tutorial and our broader community, consider checking out our DigitalOcean products which can also help you achieve your development goals.