[Solved] TypeError: replaceAll is not a function

If we call the replaceAll() method on the value that is not of a string type or if there is a browser compatibility issue , JavaScript will throw a TypeError: replaceAll is not a function.

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

What is TypeError: replaceAll is not a function error?

Let us take a simple example to demonstrate this issue.

const str = 12345
const output = str.replaceAll(1, 0)
console.log(output)

Output

TypeError: str.replaceAll is not a function

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

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

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

const str = 12345
console.log("The type of variable is",typeof str)

Output

The type of variable is number

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

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

There are three ways to fix this issue in JavaScript.

Solution 1: Convert the value into a string

We can easily resolve the issue by converting the value into a string before calling the replaceAll() method.

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. 

Let us take an example to resolve the issue using the toString() method.

const str = 12345

// Convert to string and then call replaceAll()
const output = str.toString().replaceAll('1','0')
console.log(output)

Output

02345

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 replaceAll() method.

Example – Type check using if/else

const str = "Hello World"

if (typeof str === 'string') {

    // Convert to string and then call replaceAll
    const output = str.replaceAll('Hello', "Javascript")
    console.log(output)
}
else {
    console.log("The object is not a valid string")
}

Output

Javascript World

Example – Type check using ternary operator

const str = "Hello World"

// Convert to string and then call replaceAll
const result = typeof str === 'string' ? str.replaceAll('Hello', 'Javascript') : "";
console.log(result)

Output

Javascript World

Solution 3 – Check the Browser Compatibility

The replaceAll() method is not supported in Internet Explorer and on the Chrome, Edge it supports from Version 85 and above.

In this case you can either use Polyfill or instead use the JavaScript String.prototype.replace() method

The replace() method returns a new string with some or all matches of a pattern replaced by a replacement.

Syntax

replace(regexp, substr)
replace(regexp, replacerFunction)

Parameters

The replace() method takes 2 parameters.

• regexp (pattern) – The Regex Pattern that we want to match in the string
• substr – A string that is to be replaced by newSubstr
• replacerFunction – A function to be invoked to create the new substring to be used to replace the matches to the given regexp or substr. 

const p = 'The quick brown fox jumps over the lazy dog. If the dog reacted, was it really lazy?';

console.log(p.replace('dog', 'monkey'));
// expected output: "The quick brown fox jumps over the lazy monkey. If the dog reacted, was it really lazy?"


const regex = /Dog/i;
console.log(p.replace(regex, 'ferret'));
// expected output: "The quick brown fox jumps over the lazy ferret. If the dog reacted, was it really lazy?"

Output

The quick brown fox jumps over the lazy monkey. If the dog reacted, was it really lazy?
The quick brown fox jumps over the lazy ferret. If the dog reacted, was it really lazy?

Conclusion

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