What is the difference between for in loop and for loop in js-JS Tutorial-php.cn

What is the difference between for in loop and for loop in js

一个新手

Release： 2017-09-09 13:04:16

Original

1976 people have browsed it

JavaScript for...in statement

The for...in statement is used to loop through the properties of an array or object.

for ... in Each time the code in the loop is executed, an operation will be performed on the elements of the array or the properties of the object.

Tip: for-in loops should be used to traverse non-array objects. Using for-in to loop is also called "enumeration". ·

Syntax:

for (变量 in 对象)
{    在此执行代码}

Copy after login

"Variable" is used to specify variables. The specified variables can be array elements or attributes of objects.

Example: Use for ... in to loop through the array.

<html><body><script type="text/javascript">var x
var mycars = new Array()
mycars[0] = "Saab"
mycars[1] = "Volvo"
mycars[2] = "BMW"
for (x in mycars)
{
document.write(mycars[x] + "<br />")
}</script></body></html>

Copy after login

Note 1: The for in loop will not arrange the output according to the subscript of the attribute.

//code from http://caibaojian.com/js-loop-for-in.html"first":"first",   "zoo":"zoo",  "2":"2",  "34":"34",  "1":"1",  "second":"second"};for (var i in obj) { console.log(i); };输出：1234firstzoosecond

Copy after login

When executing, press chrome to execute. First, extract the non-negative integer keys, sort the output, and then output the rest in the order of definition. Due to this weird setting, avalon's ms-with object sorting is not output as expected. You can only force users not to define key names with pure numbers.

Example 1: A new attribute is defined on the prototype object of the array, and there is no problem using the for loop

function getNewArray(){var array=[1,2,3,4,5];Array.prototype.age=13;
var result = [];for(var i=0;i<array.length;i++){
result.push(array[i]);
}alert(result.join(''));
}

Copy after login

Example 2: A for in loop is used, but it gives us the same expectation Still got the correct result of 12345

function getArrayTwo(){var array=[1,2,3,4,5 ];
var result=[];
for(var i in array){
result.push(array[i]);
}alert(result.join(''));
}

Copy after login

Example 3: After adding attributes to the prototype, it is enumerated by default, and finally outputs 1234513

function getNewArrayTwo(){var array=[1,2,3,4,5 ];
Array.prototype.age=13;var result=[];
for(var i in array){
result.push(array[i]);
}alert(result.join(''));
}

Copy after login

So it is recommended not to perform a for in loop on the array, in fact In the book High Performance JavaScript, it is also emphasized that the for in loop is not good, because it always accesses the prototype of the object to see if there are attributes on the prototype, which unintentionally adds extra time to the traversal. pressure.

Solution:

If an object has a property with the given name, then Object.prototype.hasOwnProperty(name) returns true. If the object inherits this property from the prototype chain, or does not have such a property at all, false is returned. Limit the for in loop to traverse the current through hasOwnProperty, without considering its prototype properties.

function finalArray(){var array=[1,2,3,4,5 ];
Array.prototype.age=13;
var result=[];for(var i in array){if(array.hasOwnProperty(i)){
result.push(array[i]);
}
}alert(result.join(''));
}

Copy after login

Notes:

1. Some browsers, such as the early Safari browser, do not support this method

2. Objects often Being used as a hash value, there is a risk that hasOwnProperty is blocked by another attribute (but I guess no one is so boring to use this attribute)

The above is the detailed content of What is the difference between for in loop and for loop in js. For more information, please follow other related articles on the PHP Chinese website!