For... in a loop, the cyclic counter is a string, not a number. It contains the name of the current attribute or the index of the current array element, the following is a good example. You can refer to the following. We all know that there are two methods to iterate objects in JavaScript:
(1) for Loop;
(2) for... in loop;
Using the for loop to iterate array objects will surely become commonplace. However, when using the for... in loop, you should pay attention to it. Why? Let me hear you come here ....
Javascript provides a special loop (.. in loop), used to iterate the object attributes or each element of the array,... the cyclic counter in an in loop is a string rather than a number. It contains the name of the current attribute or the index of the current array element.
Case 1:
The Code is as follows:
// Use the for .. in loop to traverse Object Attributes
Varperson = {
Name: "Admin ",
Age: 21,
Address: "shandong"
};
For (vari in person ){
Console. log (I );
}
The execution result is:
Name
Age
Address
When traversing an object, variable I, that is, the cyclic counter, is the property name of the object.
The Code is as follows:
// Use for .. in to traverse the array cyclically
Vararray = ["admin", "manager", "db"]
For (vari in array ){
Console. log (I );
}
Execution result:
0
1
2
When traversing an array, the variable I, that is, the loop counter, is the index of the current array element.
Case 2:
However, it seems that the for... in loop is quite useful now, but don't be too happy. Let's take a look at the example below:
The Code is as follows:
Var array = ["admin", "manager", "db"];
// Add a name attribute to the Array prototype
Array. prototype. name = "zhangsan ";
For (var I in array ){
Alert (array [I]);
}
Running result:
Admin
Manager
Db
Zhangsan
Why is there a zangsan?
Now let's take a look at how the for loop works?
The Code is as follows:
Vararray = ["admin", "manager", "db"];
// Add a name attribute to the Array prototype
Array. prototype. name = "zhangsan ";
For (var I = 0; ialert (array [I]);
};
Running result:
Admin
Manager
Db
Oh, now I understand that the for... in loop will traverse the methods and attributes of a prototype, so this may lead to unexpected errors in the code. To avoid this problem, we can use the hasOwnProperty () method of the object to avoid this problem. If the attributes or methods of the object are not inherited, The hasOwnProperty () method returns true. That is, the check here does not involve attributes and methods inherited from other objects. It only checks attributes directly created in the specific object itself.
Case 3:
The Code is as follows:
Vararray = ["admin", "manager", "db"];
Array. prototype. name = "zhangshan ";
For (vari in array ){
// Skip the display if the property is not directly created by the object itself (that is, the property in the prototype)
If (! Array. hasOwnProperty (I )){
Continue;
}
Alert (array [I]);
}
Running result:
Admin
Manager
Db
Everything is as good as it was before, ah, I don't know. Do you have any feelings after reading it? Is there a kind of feeling of "setting the cloud and seeing the sun "?
