Capitalize first letter of string in Javascript

Jay Ponkia
4 min readDec 29, 2020

Recently I have been practicing interview related preparation for javascript. Few of the points have been come into the picture. Like reverse string . But I have found Capitalize first letter of string more interesting.

Let’s directly get to the point. Let say we have list of strings. Here are the list of strings.

Examples

Simple Solution:

Simple solution for this is to get the first character of the string, make it upper case and join it with other characters.

Simple Solution

Here we have grabbed the first character with charAt method, made it uppercase and joined it with other characters with substring method with passing numeric argument 1, so it will take 2nd character to the last character from the string.

It is just the matter of individual preference which method to use. As all methods will give same result. Also there is no major performance issue.

String.prototype Method:

This method is used to make a string method and use it just like we are using string methods in JavaScript. Like length(), indexOf(), lastIndexOf(). So we can use our method with any string value. Here is the example.

String.prototype method

Using Array Destructuring:

To understand this solution we need to understand two features of new ES6 javascript.

  1. Array Destructuring:

So the first question is Array Destructuring? This depends upon new ES6 javascript feature. Let’s see this in example.

This is new ES6 javascript feature. If you assign both sides with array elements, then all of the variables from the left side will get it’s value from the right side. The main thing here is there should be array on both of the sides.

Numeric Array Example
Character Array(String) Example.
Default Value Example
Swap Variables
Return value with function
Ignore Variables.

2. Spread Operator

Spread operator is new javascript operator or we can say it is new feature introduced in ES6 version. It is just three dots. “…”. Yes this looks strange. But this is true. It is used to split up array elements. So we can say that we spread up array elements.

This gives you array inside array.
Use of Spread Operator

Sperad operator with Array Destructuring

Single Variable
Multiple Variables
Character Array(String) Variable.

In brief, if we put three dots before the variable name, then it will become array and take respective elements from the right side or all the elements from the right if it is a single variable.

Now let’s move to our main solution. To capitalize first character of sentence.

Capitalize first letter of string using Array Destructuring and Spread Operator.

Conclusion:

Upper casing the first character of string is a minor task. We have seen three ways to do it. Also we can convert each of the method into the function. Here we have skipped null or undefined checking.

If you liked this, then give clap for this. Also if you have another solution for this query then comment below your solution. Thank you.

--

--

Jay Ponkia

Computer Engineer By a Degree | Blogger by Passion