Question: I have defined prototype for Array indexOf ( to support array indexOf in Internet Explorer )

```
if(!Array.prototype.indexOf){
    Array.prototype.indexOf = function(obj){
        for(var i=0; i<this.length; i++){
            if(this[i]==obj){
               return i;
            }
         }
         return -1;
     }
}

```

When I am creating array with values [1,2,3], this indexOf code snippet added into the Array like below

```
["1","2","3",function(obj){for(var i=0;i<this.length;i++){if(this[i]==obj){return i;}}return -1;}]

```

This problem happens only in IE.

Can anyone help me to resolve this issue. Thanks in advance.

---

I didn't use `for...in` loop anywhere, for this I am using jQuery sortable toArray method `.sortable("toArray");`.

Answer: 
I am assuming that at some point you are using a `for...in` loop to iterate over the elements of your array. For example:

```
for (var elem in myArray) {
    //Do stuff...
}

```

A `for...in` loop will enumerate all enumerable properties of an object, including those it has inherited from it's ancestors in its prototype chain. You've added a method to the `Array` prototype:

```
Array.prototype.indexOf = function(obj){ //...

```

This property is enumerable (you can't define non-enumerable properties - see [`Object.defineProperty`](https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineProperty) - in older versions of IE), so a `for...in` loop will include this property.

The simple solution is to **never use a `for...in` loop to iterate over an array**! Use a normal `for` loop instead.
It's quite simple, you're array now contains 4 elements, of which the forth is a function object, you're not defining a new method for the array object, let alone all array objects. Just paste the first snippet at the very top of your script, then:

```
 var foo = [1,2,3];
 alert(foo.indexOf(2));//alerts 1

```

Think of `Array.prototype` as the template of every array. Whenever you try to access some property or method of an array, that isn't defined, rather then throwing errors, JS will first check the `Array.prototype` if that object doesn't have that method/property. If it does, JS will use that code, and apply it to the array that initially called it. In the above example `foo.indexOf(2)` could have been written as `Array.prototype.indexOf.apply(foo,[2]);`. In other words: JS automatically applied the function of the prototype to `foo`.

Your *"full"* code should look like this:

```
if(!Array.prototype.indexOf)
{
    Array.prototype.indexOf = function(obj)
    {
        for(var i=0; i<this.length; i++)
        {
            if(this[i] === obj)//preferable, use strict comparison
            {
                return i;
            }
        }
        return -1;
    };
}
var yourArray = [1,2,3,4,'4'];
alert(yourArray.indexOf(4));//alerts 3
alert(yourArray.indexOf('4'));//alerts 4 when using strict comparison, if not, alerts 3

```

**[Here's a fiddle](http://jsfiddle.net/GaAwP/)**, checked in IE8, and it's working just fine

Just google *prototypal inheritance* and *prototype chains* or *augmenting prototypes in JS* and the like, read up and be baffled! ;)