There are thousands of scenarios when you may need to modify a string. Commonly, there are two ways one may want to change the characters - turn the string's characters to uppercase or to lowercase. Basically, JS has two methods for doing this: string.toUpperCase() and string.toLowerCase(). They can serve you as a base to perform more specific case manipulations.

String.toUpperCase() method

The toUpperCase() method is originally String.prototype.toUpperCase(), where String shows the way of how the method should be applied or called, prototype marks that it's a built-in JS method. However, we will use the shortened String.toUpperCase() or just toUpperCase() to make it more accessible.

The method allows you to convert all the lowercase characters of the string to uppercase. Please pay attention to the fact that it converts an entire string it is applied to, making all the characters capitalized. Nevertheless, it doesn't affect any digits, special symbols, letters that are already in upper case, or alphabets that don't have upper/lower case separation.

Also, let's say that JS strings are immutable, unlike some other programming languages. It means that you will have two strings remaining in the memory after calling the String.toUpperCase() method.

The one will contain the original string, and another one will contain the string with the converted characters. Therefore, the method does not return the mutated original string; it returns the string value converted to the upper case. The method is intentionally generic, and it has no parameters, practically.

This topic primarily focuses on changing the entire string to uppercase. In case you are curious about how to capitalize the first letter of the string, or the first letter of a specific word of the string, go to Capitalize first letter to learn more.

By the way, the method is part of the ECMAScript1 or ES1 (JS 1997), which is compatible with almost all modern commercial browsers. It was implemented in JavaScript 1, which makes it fully supported in Chrome, IE, Edge, Firefox, Safari, etc.

Being a string method, toUpperCase() has quite an obvious syntax:

string.toUpperCase()

Let's see how it works in practice. We will apply the same method for the same sentence in two basic ways.

//Example 1
console.log('Today is another sunny beautiful day.'.toUpperCase())
//expected output is "TODAY IS ANOTHER SUNNY BEAUTIFUL DAY."
 
//Example 2
let text = 'Today is another sunny beautiful day.';
console.log(text.toUpperCase());
//expected output is "TODAY IS ANOTHER SUNNY BEAUTIFUL DAY."

As you can see, two symbols weren't changed by applying toUpperCase() - the first letter "T" in the sentence and dot (".") at the end of it. Both symbols remained untouched as soon as the method could not be applied. That works the same way for any symbol that can't be capitalized.

There is an example of using the string with plenty of symbols that cannot be uppercased below. In case you try to apply the method to the empty string, it will result in an empty string with no particular error.

console.log('7od@y 1s Anot@@r SUn$y Beautif8l D?Y.'.toUpperCase())
//expected output is "7OD@Y 1S ANOT@@R SUN$Y BEAUTIF8L D?Y."

Converting non-string values to strings

The method allows you to manipulate any non-string value, automatically converting it to a string. It happens when you set its this value by using call() or apply() methods to a value that isn't a string.

const con1 = 6;
const con2 = String.prototype.toUpperCase.call(typeof (con1))
console.log(con2);
//expected output is "NUMBER"
const con3 = String.prototype.toUpperCase.apply(false);
console.log(con2, con3);
//expected output ("NUMBER",  "FALSE")

What can go wrong?

First of all, the "toUpperCase is not a function" error. This is directly related to the previous paragraph. Sometimes you can face it when you try to apply a method to a value that isn't a string. You can use the method written above or just use the toString() method to convert the given value to a string.

Another type of mistake that is often made when you use the toUpperCase() method is Type error. This type of error is usually thrown when you try to call or apply it on null or undefined, for example:

String.prototype.toUpperCase.call(undefined);
//It will cause a type error

Method toLocaleUpperCase()

The next piece of advice will be handy to those who work with languages other than English. The toLocaleUpperCase() method behaves almost the same as the toUpperCase() method, but it allows you to work with locales that are incompatible with the default Unicode case mappings (for example, Turkish language).

If several locales are used in an array, the best available locale will be automatically used. Considering the understanding of toLocaleUpperCase(), it also should be said that the default toUpperCase() completely ignores any locales.

Conclusion

The toUpperCase() is the string method that allows you to change all the lowercase characters in the string to uppercase. It can be applied only for alphabetic symbols. One can use the toLocaleUpperCase() method if one needs to uppercase the symbols that are incompatible with the default Unicode symbols. It works in the same way as toUpperCase().