Extension of Array. prototype. indexOf for JS and Its Solution _ basic knowledge

This article mainly introduces the extension of Array for JS. prototype. the problem caused by indexOf and the solution can be found by a friend who needs it. The Array does not have the indexOf method, so it is troublesome to search for the index of an element in an Array. For convenience of calling, therefore, Array is extended through prototype. prototype. indexOf (), which makes it easier to use. However, this custom indexOf encountered a problem when traversing the array.

The Code is as follows:

Array. prototype. indexOf = function (item ){
For (var I = 0; I <this. length; I ++ ){
If (this [I] = item)
Return I;
}
Return-1;
}

Directly

The Code is as follows:

Var arr = [1, 2, 4, 5];
Var index = arr. indexOf (1); // index = 0

After expansion, it is very easy to use and a harmonious scene...

However, when an array element is traversed, the loop for... in causes other problems and breaks the harmonious atmosphere.

The Code is as follows:

Var a = ["Zhang Fei", "Guan Yu", "Liu Bei", "Lu Bu"];
For (var p in ){
Document. write (p + "=" + a [p] +"
");
}

I wanted to output the names of these four people. What is the output?

The output is:

The Code is as follows:

// 0 = Zhang Fei
// 1 = Guan Yu
// 2 = Liu Bei
// 3 = lub
// IndexOf = function (item) {for (var I = 0; I <this. length; I ++) {if (this [I] = item) return I;} return-1 ;}

In addition to the name, you can also output your own extension method indexOf. But what's crazy is that firefox is "normal" and there are only four people's names. Why?

The output indexOf is self-extended and understandable. After all, for .. in traverses all user-defined attributes of an object or all elements of an array.

Why not firefox?

Later I checked the information to understand,

Array in javascript1.6 already supports Array. indexOf (), while firefox I use is version 3.5. It already supports javascript1.8, and indexOf is an inherent method of its Array.

IE, even if I use IE8, supports javascript1.3.

Therefore, IE8 regards indexOf as a "user-defined attribute", while firefox regards it as an inherent attribute of its native support.

Is that true?

Make an experiment, rename indexOf myIndexOf, and try again. Both IE and firefox output myIndexOf, proving that the previous view is correct.

So there is another problem. I have extended indexOf for a long time. Now many project codes are using this method, but now I have to use .. in outputs the elements of the array. What should I do if I don't want to extend it to the Russian method?

Fortunately, javascript provides the hasOwnProperty method.

Let's take a look at its description:

The Code is as follows:

Every object descended from Object inherits the hasOwnProperty method. this method can be used to determine whether an object has the specified property as a direct property of that object; unlike the in operator, this method does not check down the object's prototype chain

The description is what we want.

Make a judgment in for... in... and it will be OK.

The Code is as follows:

If (a. hasOwnProperty (p )){
Document. write (p + "=" + a [p] +"
");
}

In addition, the hasOwnProperty usage example is attached, which is from the Internet:

The Code is as follows:

Function Book (title, author ){
This. title = title;
This. author = author;
}
Book. prototype. price = 9.99;
Object. prototype. copyright = "herongyang.com ";
Var myBook = new Book ("JavaScript Tutorials", "Herong Yang ");
// Dumping built-in properties at the base prototype level
Document. writeln ("/nObject. prototype's built-in properties :");
DumpProperty (Object. prototype, "constructor ");
DumpProperty (Object. prototype, "hasOwnProperty ");
DumpProperty (Object. prototype, "isPrototypeOf ");
DumpProperty (Object. prototype, "toString ");
DumpProperty (Object. prototype, "valueOf ");
DumpProperty (Object. prototype, "copyright ");
// Dumping built-in properties at the my prototype level
Document. writeln ("/n =========================/nBook. prototype's built-in properties :");
DumpProperty (Book. prototype, "constructor ");
DumpProperty (Book. prototype, "hasOwnProperty ");
DumpProperty (Book. prototype, "isPrototypeOf ");
DumpProperty (Book. prototype, "toString ");
DumpProperty (Book. prototype, "valueOf ");
DumpProperty (Book. prototype, "copyright ");
// Dumping built-in properties at the object level
Document. writeln ("/n ===========================/nmyBook's built-in properties :");
DumpProperty (myBook, "constructor ");
DumpProperty (myBook, "hasOwnProperty ");
DumpProperty (myBook, "isPrototypeOf ");
DumpProperty (myBook, "toString ");
DumpProperty (myBook, "valueOf ");
DumpProperty (myBook, "copyright ");
Function dumpProperty (object, property ){
Var inheritance;
If (object. hasOwnProperty (property ))
Inheritance = "Local ";
Else
Inheritance = "Inherited ";
Document. writeln (property + ":" + inheritance + ":"
+ Object [property]);
}

Check which version of the browser supports javascript:

The Code is as follows:

The JavaScript version of the browser supports testing.