Javascript: Capitalize the First Letter of Each Word (Title Case)

Last updated on November 9, 2021 A Goodman Loading... Post a comment

This short article shows you how to capitalize the first letter of each word in a string.

hypothetical inputs and expected outputs:

'dog and cat' // Dog And Cat
'WHO stands for world health organization' // WHO Stands For World Health Organization'
'I love puppies' // I Love Puppies

we will just capitalize the first letter of a word and keep the rest of the word as it is. Abbreviations such as WHO will remain WHO (not Who).

The Strategy

To achieve the goal, we will go through the following steps:

  1. Use the split() method to create an array of words from the given string
  2. Slice the first letter of each word by using the slice() function
  3. Use the toUpperCase() method to capitalize all the first letters
  4. Concatenate the capitalized letters with the corresponding parts of words
  5. Using the array join() method to return the desired string

This instruction may be confusing. The example below will help you get a better understanding.

Example

The code:

const toTitleCase = (input) => {
    const words = input.split(' ');
    const titleWords = []; // The array of title words
    for (const word of words) {
        const firstLetter = word.slice(0, 1).toLocaleUpperCase(); // Capitalize the first letter
        const rest = word.slice(1); // Not modify this part
        titleWords.push(`${firstLetter}${rest}`);
    }
    const result = titleWords.join(' ');
    return result;
};

console.log(toTitleCase('This is a bad thing'));
console.log(toTitleCase('WHO stands for world health organization'));
console.log(toTitleCase('I love puppies'));

Output:

This Is A Bad Thing
WHO Stands For World Health Organization
I Love Puppies

The code snippet above can be written in TypeScript like this:

const toTitleCase = (input: string): string => {
  const words = input.split(' ');

  const titleWords: string[] = []; // The array of title words

  for (const word of words){
    const firstLetter = word.slice(0, 1).toLocaleUpperCase(); // Capitalize the first letter
    const rest = word.slice(1); // Not modify this part
    titleWords.push(`${firstLetter}${rest}`); 
  }

  const result = titleWords.join(' ');
  return result;
}

console.log(toTitleCase('This is a bad thing'));
console.log(toTitleCase('WHO stands for world health organization'));
console.log(toTitleCase('I love puppies'));

Alternative Approaches

If you want to get the job done quickly without writing your own function from scratch then you can use a third-party library. Some good ones are title-case and capital-case.

Conclusion

You’ve learned how to capitalize the first letter of every word from a given string. If you’d like to explore more new and awesome things in the modern Javascript world, take a look at the following articles:

You can also check out our Javascript category page or TypeScript category page for the latest tutorials and examples.

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments

You May Also Like