[Solved] TypeError: toUpperCase is not a function

If we call the toUpperCase() method on the value that is not of a string type, JavaScript will throw a TypeError: toUpperCase is not a function.

In this tutorial, we will look at what is TypeErrror: toUpperCase is not a function error and how to resolve them with examples.

What is TypeError: toUpperCase is not a function error?

Let us take a simple example to demonstrate this issue

// Declare and store the data into a variable
const str = 123456

// Convert to uppercase
str.toUpperCase()

Output

TypeError: str.toUpperCase is not a function

In the above example, we have declared a variable and assigned the Number value into it.

In the next statement, we call the String.toUpperCase() method on the value of the type Number, and hence we get a TypeError: toUpperCase is not a function.

We can also check the variable type using typeof() to confirm the datatype.

// Declare and store the data into a variable
const str = 123456

console.log("The data type is", typeof str)

Output

The data type is number

How to fix TypeError: toUpperCase is not a function error?

The String.toUpperCase() method can only be used on the string values and not on any other types. 

There are two ways to fix this issue in JavaScript.

Solution 1: Use the toUpperCase() method on a valid string object

We can easily resolve the issue by using the toUpperCase() method on the valid string values.

If we know the value can be converted to a valid string, then we can use the toString() method in JavaScript that returns the string representing the object. 

If we have a list of string values in an Array we can use Array.prototype.map() which iterates over the each elements of an Array and perform the toUpperCase operation on each string values.

Let us take an example to resolve the issue using the toString() and Array.prototype.map() methods.

// Declare and store the data into a variable
const num =  12345 

// Convert to string object
const str = num.toString()
console.log(str.toUpperCase())

// Valid string object
const data = "hello world"
console.log(data.toUpperCase())

// In case of Array
const arr = ["Microsoft", "Apple"]
const output = arr.map(str => str.toUpperCase());
console.log(output)

Output

12345
HELLO WORLD
[ 'MICROSOFT ', ' APPLE' ]

Solution 2 – Performing the type check

We can also perform a type check on the variable to check if it’s a string before calling the toUpperCase() method.

Example – Type check using if/else

// Declare and store the data into a variable
const str = 12345

if (typeof num === 'string') {
    console.log(str.toUpperCase())
}

else {
    console.log("The object is not of type string")
}

Output

The object is not of type string

Example – Type check using ternary operator

We can also perform a type check in single line using the Ternary operator as shown below.

// Declare and store the data into a variable
const num = 12345

// Ternary opertor to check if variable is string
const output = typeof num === 'string' ? num.toUpperCase() : 'The object is not of type string'
console.log(output)

Output

The object is not of type string

Conclusion

The TypeError: toUpperCase is not a function occurs if we call a toUpperCase() method on the value that is not of a type string. We can resolve the issue by calling the toUpperCase() method on a valid string or by converting the value into a valid string before calling the toUpperCase() method or by performing a type check; we can mitigate this error.