The object doesn't support property or method 'includes' in IE 8

Introduction

In this article, I am going to explain how to fix the error Object doesn't support property or method 'includes' as well as Object doesn't support property or method 'indexOf' in internet explorer (IE) browser. Here, I will also explain about prototype and Polyfill in the javaScript.

This is a common error while you working with cross-browser compatibility for your web application. I am working with one of my web application projects to make it cross-browser compatible, I got the error from the internet explorer (IE) 8 browser, Object doesn't support property or method 'includes'. I tried many possible ways to fix this issue in IE 8. Finally, I got the solution for the same, I would like to share it with you, so if you will get the same error then with the help of solutions explained in this article, you can fix it very quickly.

You may like to more articles on JQuery and JavaSripts:

1. Export Gridview in Excel using JQuery in ASP.NET Web Forms
2. Export JSON to CSV using JQuery/Javascript and Bootstrap in ASP.NET
3. Export AngularJs Table in Excel using JQuery in ASP.NET Web Forms

Requirement

1. What is Polyfill?
2. What is a prototype in Javascript?
3. Explain ways to fix error Object doesn't support property or method 'includes' in IE 8.

Implementation

So, let's start with the definitions of Polyfill and prototype in the Javascript, then we will learn how to fix error Object doesn't support property or method 'includes' in IE.

Polyfill

In web development, a polyfill is a JavaScript code, that is used to the provide latest feature or functionality on the older browsers that do not support it. It uses non-standard features or functionalities in certain browsers to provide a standards-compliant way to access the latest features or functionalities.

Prototype

A prototype is an object in JavaScript. All the methods and properties in the javascript inherit from a prototype. It allows you to add new or custom methods and properties to all the instances of an object.

Ways to Fixed the error

There are two different ways are available, that you can use to fix this issue.

1. Use indexOf() method instead of includes() method 
2. Use the polyfill

1. Use indexOf() method instead of includes() method

you can use the indexOf() method instead of the includes() method, as I showed in the below example.

var arr = [1, 2, 3, 4, 5, "Codingvila"];
console.log(arr.indexOf("Codingvila") > -1) 

2. Use the polyfill

You can use the polyfill. To use polyfill you should write the below script on top of all imports in your web application. To get more information about polyfill, you can visit MDN web docs.

Array.prototype.includes = null;
Array.prototype.indexOf = null;
if (!Array.prototype.includes) {
    Array.prototype.includes = function (search) {
        return !!~this.indexOf(search);
    }
}
if (!Array.prototype.indexOf) {
    Array.prototype.indexOf = (function (Object, max, min) {
        "use strict";
        return function indexOf(member, fromIndex) {
            if (this === null || this === undefined) throw TypeError("Array.prototype.indexOf called on null or undefined");
            var that = Object(this), Len = that.length >>> 0, i = min(fromIndex | 0, Len);
            if (i < 0) i = max(0, Len + i); else if (i >= Len) return -1;
            if (member === void 0) {
                for (; i !== Len; ++i) if (that[i] === void 0 && i in that) return i;
            } else if (member !== member) {
                for (; i !== Len; ++i) if (that[i] !== that[i]) return i;
            } else for (; i !== Len; ++i) if (that[i] === member) return i;
            return -1;
        };
    })(Object, Math.max, Math.min);
}

Example

Now, let's take one example, and write a log into the console window as I have shown below, and it will work well.

var object = { Name: "Nikunj Satasiya", Name: "Hiren Dobariya", Name: "Vivek Ghadiya" };
var arr = [1, 2, "Codingvila", object];
 
console.log("List of Items includes 1 :", arr.includes(1));
console.log("List of Items includes \"Codingvila\" :", arr.includes("Codingvila"));
console.log("List of Items includes object :", arr.includes(object));
console.log("List of Items includes Nisha Patel :", arr.includes("Nisha Patel"));

Output

> "List of Items includes 1 :" true
> "List of Items includes "Codingvila" :" true
> "List of Items includes obj :" true
> "List of Items includes Nisha Patel :" false

Summary

In this article we learned how to fixed object doesn't support property or method 'includes' or 'indexOf' in IE 8, as well as basics of polyfill and prototype in Javascript.