Title Case a Sentence

This blog explains my solution to the Title Case a Sentence, a Bonfire exercise from Free Code Camp. The goal of this exercise is to return the given sentences with the first letter of each word capitalized, while the rest of the word is lowercase. To write the code, you need to use several methods - split(), charAt(), toUpperCase(), substr(), toLowerCase(), and join() methods

This tutorial is written for people who know a little about JavaScript but are not familiar with all these methods. You might be new to JavaScript, curious about how these methods work, or interested in writing code that will return a sentence with the first letter of each word capitalized.

Initial Problem

The initial code that’s given looks like this:

Solution

There are lots of methods needed in order to achieve this task, so let’s first write this in pseudo-code. I’ll explain what I’m thinking about through each step before I even write my code. This will help me visualize what I want the code to do. So here goes:

  1. I want to split the phrase into an array of words. This allows me to target each word. I can use split() method to achieve this.
  2. Next I want to iterate through each word in the array (using a for loop)
  3. While looping I'll look to find the first letter of each word. I'll do this using charAt(0) method. Once I've located the first letter of the sentence, I'll capitalize it (using toUpperCase method).
  4. Then I want to locate the rest of the word. This time I'll use charAt(1). Once it's located, I'll write the remaining letters in lowercase (using toLowerCase)
  5. Finally I need to reconnect all these separate words back into a single phrase using join().

Cool Beans! So let’s begin, shall we?

First let’s split each word in the given sentence , using the split() method. I simply rewrote the str variable, assigning it the split() method.

Next I created a for loop. This allows me to iterate through each word in the sentence . And the code I apply builds each word (called str[1]) out of two parts: the first letter and the rest of the word. The first letter is made using charAt() and toUpperCase() methods. And the rest of the word is made using charAt() and toLowerCase() methods.

Once I combine these two parts together for each word in the array, then I simply join all words back together, using the join() method. When any sentence is passed through this function, the final output will create a phrase that capitalizes the first letter of each word while all other letters remain lowercase.

Finished Code

Although we needed to use quite a number of methods to achieve our task, it wasn’t too difficult, right? We’ve seen many of these methods before - split(), join(), toUpperCase() and toLowerCase()....so we just needed to learn about the charAt() method.

The charAt() method is useful as it allows us to find and target a specific character (in this case a letter in a word) at a specific index within a string. All we needed to do was pass the index number of the character we’re targeting. Hopefully this wasn’t too painful, and that you learned how to return a sentence that capitalizes the first letter of each word. JavaScript is quite useful, no?