How to Capitalize First Letter in JavaScript Strings

If you want to capitalize the first letter of a string in JavaScript, this easy guide is for you. Here you will learn how to uppercase the first letter in JS using simple code.

Javascript Capitalize First Letter – Easy Method Explained

To uppercase the first letter of a word in JS while lowercasing the rest of the string is very simple. It requires the combination of three string methods: charAt(), toUpperCase() and slice().

• charAt(): This method returns the character at the position specified inside the parenthesis.

const dessert = "chocolate cake";

const firstLetter = dessert.charAt(0); // "c"

• toUpperCase(): This method allows us to capitalize a specific string or character, uppercasing the entire word passed to toUpperCase().

const dessert = "chocolate cake";

const firstLetter = dessert.charAt(0); // "c"

const firstLetterUpper = firstLetter.toUpperCase(); // "C"

• slice(): This method returns a shallow copy of a portion of an array or string, selected from start to end (end not included), without modifying the original array or string.

const dessert = "chocolate cake";

const remainingString = dessert.slice(1); // "hococolate cake"

After explaining these three string methods, making the first letter of a string uppercase in JS is pretty straightforward. Combine charAt(0) with toUpperCase() and then call the slice(1) method from position one to add the rest of the string.

const dessert = "chocolate cake";

const result = dessert.charAt(0).toUpperCase() + dessert.slice(1);

console.log(result); // "Chocolate cake"

Function to Capitalize First Letter in JavaScript

Functions provide an efficient way to automate repetitive tasks, saving time and making the code simpler. In this case, we can therefore create a function to capitalize the first letter of any given string passed as argument. After declaring our custom function, we can then call capitalizeFirstLetter() whenever we want to uppercase the first letter of any given string. Here’s how you can do it:

function capitalizeFirstLetter(string) {
    if (typeof string !== 'string' || string.length === 0) {
        return '';
    }
    return string.charAt(0).toUpperCase() + string.slice(1);
}

// Example

const myString = "hello world";

console.log(capitalizeFirstLetter(myString)); // "Hello world"

To ensure that the code runs smoothly and performs the desired actions, the function capitalizeFirstLetter() includes a conditional test to check whether the argument passed is a string and is not empty. The function returns ‘ ‘ in case that:

• typeof string !== “string” to exclude arguments which are not strings;
• string.length === 0 : to exclude empty strings.

Conclusion

Capitalizing the first letter of a string in JS is a common task that you will often face as a programmer. JavaScript provides us with three powerful string methods that we can combine to efficiently uppercase only the first letter of a word while keeping the remaining characters lowercase. Call str.chartAt(0).toUppercase + str.slice(1) and you will easily achieve your goal.