There is no dedicated function in Javascript to capitalize the first letter of a String, but there is a simple one-line code that can be used to do so.
We will be using three different Javascript functions to capitalize the first letter of a string. The first one is charAt(), the second one is toUpperCase() function and the third one is slice() function. If you are a smart Javascript coder, you already know what we are about to do.
So let's jump to the code quickly.
How to Capitalize First Letter of String in JavaScript
Use charAt(), toUpperCase() and slice() Function
Here is the code that would work for you:
let someString = 'foo';
// capitalize the first letter
someString = someString.charAt(0).toUpperCase() + someString.slice(1);
What we have done in the code above is that we picked the character at index 0, which is the first character, converted it into uppercase, and then concatenated the remaining string back to it.
charAt()
Well the charAt() function in JavaScript is used to return the character at the given index. The index starts from 0, just like an array, which means, charAt(0) will return the first character of the given string.
Syntax of charAt() function:
string.charAt(index);
Let's take a quick example,
const str1 = 'studytonight';
const str2 = str.charAt(0);
console.log(str2);
s
toUpperCase()
As the name suggests, this function is used to convert characters to upper case. You provide a string to this function and it will convert it to uppercase. This function expects no parameter and its very straightforward to use.
Syntax for toUpperCase() function,
string.toUpperCase();
Let's take a quick example,
let str1 = "studytonight";
console.log(srt1.toUpperCase());
STUDYTONIGHT
slice()
The slice function is used to slice or cut any string from a starting index to and ending index. If you just provide the starting index, then the slice function will slice out the substring starting from the given index till the end.
Syntax for slice() function:
string.slice(start, end)
Let's take a quick example,
let str1 = 'studytonight';
let str2 = str1.slice(1);
console.log(str2);
studytonight
Now that you have all this knowledge, it should be easier for you to understand, the code we provided at the top to make the first letter of the string uppercase.
How to make the first letter uppercase in String?
We extract the first character using the charAt() function, then use the toUpperCase() function to convert it to upper case, and then append the remaining string to it using the slice() function.
let someString = 'foo';
// capitalize the first letter
someString = someString.charAt(0).toUpperCase() + someString.slice(1);
Using toUpperCase() and substring() function
If you do not want to use so many functions, there is a simpler way too, to do this:
let someString = 'foo';
// capitalize the first letter
someString = someString[0].toUpperCase() + someString.substring(1);
We do not have to use the charAt() function to get the character at the first index, we can directly use the index with the string variable.
The above solution will work for a string that has a single word. If you provide a string with multiple words, the above solution will change the first character of only the first word to uppercase. So how will you change the first character to uppercase for all the words?
Capitalize the first character of every word in a String
We can use for loop in JavaScript to iterate on each word of the string and then convert the first character to uppercase for each word.
let str = 'i love using studytonight';
// split above sentence into array of words, breaking at spaces
let arr = str.split(" ");
// iterate over the array, change the first character to uppercase for each word
for (let i = 0; i < arr.length; i++) {
arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].slice(1);
}
// join the words to form the string again
str = arr.join(" ");
console.log(str);
I Love Using Studytonight
Conclusion:
So many new things covered in this article. You learned 4 new JavaScript functions and an interesting use case where we have to use them together like the Avengers to solve a bigger problem.
If you know a better solution, do share it with us in the comments below.
Frequnetly Asked Questions(FAQs)
1. How to make first letter of each word in string uppercase in JavaScript?
Here's how you can make first letter of each word in string uppercase in JavaScript
const capitalizeWords = (str) => {
return str.replace(/\b\w/g, (char) => char.toUpperCase());
};
const sentence = "hello world";
const capitalizedSentence = capitalizeWords(sentence);
console.log(capitalizedSentence);
2. How to make a string uppercase in JavaScript?
Here are the steps to make a string uppercase in JavaScript;
const uppercaseString = (str) => {
return str.toUpperCase();
};
const lowercaseString = "hello world";
const uppercaseResult = uppercaseString(lowercaseString);
console.log(uppercaseResult);
3. How do you capitalize the first letter?
In JavaScript, you can capitalize the first letter of a string using the following code snippet:
const capitalizeFirstLetter = (str) => {
return str.charAt(0).toUpperCase() + str.slice(1);
};
const lowercaseWord = "hello";
const capitalizedWord = capitalizeFirstLetter(lowercaseWord);
console.log(capitalizedWord);
4. How to convert first letter of string to uppercase in typescript?
In TypeScript, you can convert the first letter of a string to uppercase using the same code as in JavaScript:
const capitalizeFirstLetter = (str: string): string => {
return str.charAt(0).toUpperCase() + str.slice(1);
};
const lowercaseWord: string = "hello";
const capitalizedWord: string = capitalizeFirstLetter(lowercaseWord);
console.log(capitalizedWord);
You may also like:
