How to Capitalize a Word in JavaScript

Manipulating strings is one of the most useful things to know how to do in JavaScript.

A common operation that involves manipulating strings is capitalizing a word, meaning you want to take a word and make the first letter uppercase and the rest of the letters lowercase.

In this post, we'll learn all the different ways to capitalize a word in JavaScript.

Capitalize a word using charAt

The easiest way to capitalize a word is to use the charAt method. The charAt method returns the character at the index provided within the string.

We can use it to return the first character of a string and then use the toUpperCase method to make it uppercase.

Let's start with an example string:

JAVASCRIPT
const string = 'javaSCRIPT';

Now we can use the charAt method to get the first character of the string and then use the toUpperCase method to make it uppercase:

JAVASCRIPT
const firstLetter = string.charAt(0).toUpperCase();

Finally, we'll need to take the rest of the string and make it lowercase. We can do this by using the slice method to get the rest of the string and then using the toLowerCase method to make it lowercase:

JAVASCRIPT
const restOfString = string.slice(1).toLowerCase();

Now we can combine the first letter and the rest of the string to get the capitalized word:

JAVASCRIPT
const capitalizedWord = firstLetter + restOfString;

Here's the full method:

JAVASCRIPT
const string = 'javaSCRIPT';

const capitalizeWord = (string) => {
    const firstLetter = string.charAt(0).toUpperCase();
    const restOfString = string.slice(1).toLowerCase();
    return firstLetter + restOfString;
}

const capitalized =  capitalizeWord(string);

console.log(capitalized);

JAVASCRIPT
Javascript

Using the Bracket Notation

Another way to capitalize a word is to use the bracket notation. This is similar to the charAt method, but it's a little easier to use.

All we need to do is replace where we use the charAt method with the bracket notation:

JAVASCRIPT
const firstLetter = string[0].toUpperCase();

Here's the full example:

JAVASCRIPT
const string = 'javaSCRIPT';

const capitalizeWord = (string) => {
    const firstLetter = string[0].toUpperCase();
    const restOfString = string.slice(1).toLowerCase();
    return firstLetter + restOfString;
}

const capitalized =  capitalizeWord(string);
console.log(capitalized);

JAVASCRIPT
Javascript

Using the substring method

The substring method is similar to the slice method. The difference is that the substring method cannot accept negative indexes.

We can use the substring method to get the rest of the string and then use the toLowerCase method to make it lowercase:

JAVASCRIPT
const restOfString = string.substring(1).toLowerCase();

Here's the full example:

JAVASCRIPT
const string = 'javaSCRIPT';

const capitalizeWord = (string) => {
    const firstLetter = string.charAt(0).toUpperCase();
    const restOfString = string.substring(1).toLowerCase();
    return firstLetter + restOfString;
}

const capitalized =  capitalizeWord(string);

console.log(capitalized);

JAVASCRIPT
Javascript

Conclusion

In this post, we learned how to capitalize a word in JavaScript.

We learned how to use the charAt method, the bracket notation, and the substring method to capitalize the first letter and lowercase the rest of the string.

Thanks for reading!

• Support Us
• Discord
• Share
• Post
• Share