JavaScript

TypeError: includes is not a function in JavaScript

In JavaScript, there can be a need to search for a specific value from the data. For instance, looking for a particular record to utilize. In such a situation, there can be an error encountered when you search for values other than string or array. So, this article will state the approaches to resolve the encountered TypeError: includes is not a function in JavaScript.

What is the includes() Method in JavaScript?

The “includes()” method outputs true in return if the particular value is included in the string.

Syntax

string.includes(value)

In the above-given syntax, the includes() method will look for the specified “value” in the “string”.

How Does the TypeError: includes is not a function Occur?

The “includes is not a function” type error occurs when the includes() method is accessed on a value that is neither of the type “string” nor “array”. To resolve the error/query, transform the value into a string or array before accessing the method.

Example:

In this example, the particular encountered error will be displayed for demonstration:

<script type="text/javascript">

let get = 12

if (get.includes(1)){

console.log("true")

}

else{

console.log("false")

}

</script>

In the above code snippet:

  • Initialize an integer value.
  • In the next step, apply the “includes()” method to check for the contained integer in the initialized value previously.
  • The corresponding message in the “if/else” condition will be displayed upon the satisfied and unsatisfied condition, respectively.

Output

As the includes() method does not handle values other than string or array. Hence, the stated error is displayed upon the included integer value.

How to Handle the Error Exception?

To handle the stated error’s exception, apply the following approaches in combination with the “includes()” method:

  • typeof” operator.
  • isArray()” method.

The “typeof” operator gets the variable’s data type, and the “isArray()” method analyzes whether the specified object is an array or not. The former approach can be applied to check for the string data type, and the latter approach is for the contained value in an array.

Syntax

Array.isArray(ob)

In the above syntax:

  • ob” points to the object that needs to be tested.

Example 1: Checking if the Value is String

In this example, the error’s exception will be handled by applying a check for the string datatype upon the initialized value:

<script type="text/javascript">

let get = 12;

let compute = typeof get === 'string' ? get.includes(1) : false;

console.log(compute);

</script>

In the above lines of code:

  • Specify the string value.
  • In the next step, apply the “typeof” operator to check if the data type of the specified value in the previous step is “string”.
  • This will be accomplished with the help of the “ternary” operator.
  • Upon the condition is true, the first expression will be executed after “?”.
  • Elsewise, the expression after the “:” will come into effect.
  • This will result in displaying the boolean value “false” after “:” as the stated condition is not satisfied.

Output

In this output, it is clear that the latter expression is executed upon the unsatisfied condition.

Example 2: Checking if the Value is Contained in an Array

In this particular example, the error’s exception will be handled by checking for the value contained in an array:

<script type="text/javascript">

let get = [1, 2]

let compute = Array.isArray(get) ? get.includes(1) : false;

console.log(compute);

</script>

In the above lines of code:

  • Declare an array of the stated integer values.
  • After that, associate the “isArray()” method with the declared array to check for the condition via the “ternary” operator.
  • In this case, the condition will be truthy, and so, the first expression after the “?” will come into effect.
  • This particular expression will return “true” as the specified integer value is included in the array.

Output

The above output indicates that the applied condition is true, and the stated value is contained in an array.

How to Resolve the TypeError: includes is not a function Using JavaScript?

To resolve the stated type error, apply the following approaches combined with the “includes()” method:

Approach 1: Resolve the Type Error Using toString() Method

The “toString()” method gives a number in the form of a string. This method can be implemented to resolve the stated error by converting the integer value into a string and returning true against the method.

Syntax

number.toString(radix)

In the above syntax:

  • radix” is the “base” to use.

Example

The following example illustrates the stated concept:

<script type="text/javascript">

let get = 12

if (get.toString().includes('1')){

console.log("true")

}

else{

console.log("false")

}

</script>

Apply the below-given steps, as stated in the above code:

  • Initialize the stated integer value.
  • After that, associate the “toString()” method with the initialized value to convert it into a string.
  • Now, apply the “includes()” method to the converted string value in the previous step.
  • This will resultantly execute the “if” condition as the applied conditions in the previous steps are satisfied.

Output

Approach 2: Resolve the Type Error Using Array.from() Method

The “Array.from()” method gives an array from an object having the array’s length as its parameter. This method can be utilized to place the integer values in an array and apply a check on them.

Syntax

Array.from(object, map, value)

In this syntax:

  • object” is the object that needs to be transformed into an array.
  • map” indicates the map function that needs to be mapped on each element.
  • value” signifies the value that needs to be utilized as “this” for the map function.

Example

Let’s go through the below-stated example:

<script type="text/javascript">

let get = [1, 2];

let compute = Array.from(get).includes(1);

console.log(compute);

</script>

In the above code block:

  • Add the stated values in an array named “get”.
  • Now, apply the combined “Array.from()” and “includes()” methods to check for the included integer in the array.
  • As a result, the boolean value “true” will be displayed as the condition is satisfied for the “includes()” method.

Output

This particular output signifies that the required functionality is achieved.

Conclusion

The “includes()” method combined with the “toString()” or the “Array.from()” methods can be utilized to solve the TypeError: includes is not a function using JavaScript. The stated error occurs on values other than string or array. So, this write-up converted those values into string and array, and so the stated error was resolved. This blog explained the procedure of resolving the TypeError: includes is not a function using JavaScript.

About the author

Umar Hassan

I am a Front-End Web Developer. Being a technical author, I try to learn new things and adapt with them every day. I am passionate to write about evolving software tools and technologies and make it understandable for the end-user.