While working with JavaScript, you may encounter a situation where you want to convert a “string” to “uppercase” characters. For instance, it is required to perform a case-sensitive comparison in your JavaScript program. To do so, you can use the JavaScript built-in String “toUpperCase()” method that assists in converting the characters of a string to uppercase format.

This post will discuss the usage of the JavaScript String toUpperCase() method. So, let’s start!

What is JavaScript String toUpperCase() method

The “toUpperCase()” method is used for converting “string” characters to “uppercase” format. As JavaScript “string” is of “immutable” type, the “toUpperCase()” method returns a new string and does not modify the original string.

Syntax

Here the “toUpperCase()” method will convert the characters of the “string” to “uppercase” format.

Now, check out the below-given examples to better understand the implementation of the String “toUpperCase()” method in JavaScript.

Example 1: Convert whole string to uppercase using JavaScript String toUpperCase() method

First of all, we will create a “string” variable having the value “This is linuxhint.com”:

var string = ‘This is linuxhint.com’;

To convert the whole “string” to “uppercase”, we will use the JavaScript “string.toUpperCase()” method:

console.log(string.toUpperCase());

Execution of the above-given program will show the following output:

<img alt="" data-lazy- data-lazy-src="https://kirelos.com/wp-content/uploads/2022/04/echo/javascript-string-touppercase-method-01.png" data-lazy- height="182" src="data:image/svg xml,” width=”840″>

Example 2: Convert a string with special characters to uppercase using JavaScript String toUpperCase() method

In case if the created “string” comprises any “special characters”, then the JavaScript String “toUpperCase()” method will convert all lowercase characters to uppercase without making any changes to the added special characters:

Here, the JavaScript String “toUpperCase()” method will convert the string “This is [email protected]#^&%hint” to uppercase:

<img alt="" data-lazy- data-lazy-src="https://kirelos.com/wp-content/uploads/2022/04/echo/javascript-string-touppercase-method-02.png" data-lazy- height="178" src="data:image/svg xml,” width=”838″>

Example 3: Convert first character of a string to uppercase using JavaScript String toUpperCase() method

Do you want to convert only the first character of a “string” to “uppercase”? To do so, follow the below-given instructions:

Firstly, create a string variable “str” and store the desired value in it:

In the next step, we will fetch the first character of the created string “str” using its index 0” and convert it to “uppercase” by invoking the “toUpperCase()” method. Then, utilize the “substring()” method to generate a new string that contains all characters of “str” except the “first” one and combine this substring with the converted first uppercase character with the concatenation operator ”:

const string= str[0].toUpperCase() str.substring(1);


console.log(string);

The given output signifies that only the first character of the “str” string is converted to uppercase using JavaScript String “toUpperCase()”  method:

<img alt="" data-lazy- data-lazy-src="https://kirelos.com/wp-content/uploads/2022/04/echo/javascript-string-touppercase-method-03.png" data-lazy- height="182" src="data:image/svg xml,” width=”838″>

Example 4: Convert first character of every word to uppercase using JavaScript String toUpperCase() method

In the previous example, we have seen the procedure to capitalize only the first character of a string that comprises a single word. However, if a string contains more than one word and you want to convert the first character of each word to “uppercase,” then have a look at the below-given example:

We will now create a string named “str” with the following value:

const str= ‘hello this is linuxhint’;

Then we will split up each word of the string “str” using the JavaScript “split()” method. The “split()” method is invoked with the “str” string object while passing the space character “(‘ ‘)” as a “separator” to split the “str” string between words:

const strArray= str.split(‘ ‘);

The execution of the above-given statement will return an array of words:

console.log(‘String Array: ‘ strArray);

In the next step, we will utilize the “strArray.map()” method to iterate through the resultant array of words and perform the same operation of converting the first character of each word to “uppercase”:

const firstWordArray= strArray.map(word => word[0].toUpperCase() word.substring(1));


console.log(‘String Array with first capitalize word: ‘ firstWordArray);

At this point, the “firstWordArray” contains the first character of each word in the “uppercase” format. However, the words exist as elements of the “firstWordArray”.

Now, to combine the “firstWordArray” elements into a “string”, we will use the JavaScript “join()” method which separates the words according to the specified separator “(‘ ‘)”:

const string = firstWordArray.join(‘ ‘)


console.log(‘Resultant string: ‘ string);

As you can see in the below-given output, we have successfully converted the first character of each word of the “str” string to “uppercase”:

<img alt="" data-lazy- data-lazy-src="https://kirelos.com/wp-content/uploads/2022/04/echo/javascript-string-touppercase-method-04.png" data-lazy- height="292" src="data:image/svg xml,” width=”840″>

That was all essential information related to the JavaScript String toUpperCase() method. You can further research as needed.

Conclusion

The JavaScript “toUpperCase()” method is used for converting “string” characters to “uppercase” format. It returns a new string and does not make any changes to the original string. You can utilize the JavaScript toUpperCase() method to convert a whole string or only the first character of the words present in a string to uppercase. This post discussed the usage of the JavaScript toUpperCase() method.

About the author

<img alt="" data-lazy-src="https://secure.gravatar.com/avatar/c73b74cd8044d2e9b300610f5af77d0b?s=112&r=g" data-lazy- height="112" src="data:image/svg xml,” width=”112″>

Sharqa Hameed

I am a Linux enthusiast, I love to read Every Linux blog on the internet. I hold masters degree in computer science and am passionate about learning and teaching.