Learn how to make the first letter of a string (or array of strings) uppercase.
One really common question that gets asked by a new developer is How do I make the first letter of a string uppercase in JavaScript? Using the JavaScript Capitalize First Letter code. In this post, we’ll discuss how to use JavaScript to capitalize the first letter of a word or sentence.
JavaScript Capitalize First Letter
If you’re just looking for the code the JavaScript code to capitalize the first letter of a string (sentence case), here’s an example: var str = ‘the quick brown fox jumps over the lazy dog’; var sentenceCaseStr = str[0].toUpperCase() + str.slice(1).toLowerCase(); console.log(sentenceCaseStr); // The quick brown fox jumps over the lazy dog
Explanation
We first start off with a sentence stored as a string in the variable, str. This is the string we want to convert to sentence case with JavaScript by capitalizing the first letter. To create our sentence case string, we take the first character from the original by using square brackets and specifying 0. This works very much like accessing the first element of an array. We can then convert this single character to upper case by calling the *toUpperCase *function directly on the string. Of course, this only gives us the first character of the original string but we also need the remainder. We get this by calling the *slice *function on the original string. By giving the *slice *function the argument of *1 *we skip over the first character of the original string and return the rest. As a final safeguard, we also make sure the rest of the string is lowercase by calling the *toLowerCase *function.
Javascript Capitalize First Letter Of Each Word In Array
We might also want to capitalize the first letter of each word in a sentence or all of the individual strings in an array. Both of these scenarios are actually quite similar… var str = ‘the quick brown fox jumps over the lazy dog’; var words = str.split(‘ ‘); words = words.map(function(word) { return word[0].toUpperCase() + word.slice(1).toLowerCase(); }); var sentenceCase = words.join(‘ ‘); console.log(sentenceCase); // The Quick Brown Fox Jumps Over The Lazy Dog In the above example, we take a base string, split it into an array of strings for each word then apply the capitalization code to each word using the map function. Finally, to reconstruct the sentence we join the array back together and store it in the *sentenceCase *variable. If we had an array of strings, the exact same code can be used but we don’t need to include the part where we split the initial string.
Capitalize First Letter JavaScript ES6 Version
We could wrap the above two code examples into functions to use within our apps but let’s convert the code to ES6 too so it’s ready to be used in production. We’ll use ES6 arrow functions to make the code even more concise. const sentenceCase = (str) => str[0].toUpperCase() + str.slice(1).toLowerCase(); const convertSentence = (sentence) => sentence.split(‘ ‘).map(sentenceCase).join(‘ ‘); const str = ‘the quick brown fox jumps over the lazy dog’; console.log(convertSentence(str)); // The Quick Brown Fox Jumps Over The Lazy Dog