blocks|key|5438725|text|使用for+(myArray中的var+i)，您也可以遍历对象，我将包含键名，您可以通过myArrayi访问该属性。此外，您将添加到对象中的任何方法也将包含在循环中，也就是说，如果您使用任何外部框架，如jQuery或prototype，或者如果您直接将方法添加到对象原型中，我将在某一时刻指向这些方法。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5438726|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

With for (var i in myArray) you can loop over objects too, i will contain the key name and you can access the property via myArray[i]. Additionaly, any methods you will have added to the object will be included in the loop, too, i.e., if you use any external framework like jQuery or prototype, or if you add methods to object prototypes directly, at one point i will point to those methods.

blocks|key|5438778|text|我会根据我想要引用这些项的方式使用不同的方法。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5438779|如果您只想要当前项，请使用foreach。|5438780|如果需要索引器进行相对比较，则使用for。(例如，这与上一项/下一项相比如何？)|5438781|我从来没有注意到性能上的差异。我会等到出现性能问题时再担心它。|5438782|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|J|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|K|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|L|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|M|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|I|$]]

I'd use the different methods based on how I wanted to reference the items.

Use foreach if you just want the current item.

Use for if you need an indexer to do relative comparisons. (I.e. how does this compare to the previous/next item?)

I have never noticed a performance difference. I'd wait until having a performance issue before worrying about it.

blocks|key|4027547|text|选择应该基于哪个习惯用法是最容易理解的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4027548|使用以下命令迭代数组：|4027549|for+(var+i+=+0;+i+<+a.length;+i%2B%2B)
+++//do+stuff+with+a[i]|code-block|syntax|javascript|4027550|使用以下命令迭代用作关联数组的对象：|4027551|for+(var+key+in+o)
++//do+stuff+with+o[key]|4027552|除非你有惊天动地的理由，否则请坚持既定的使用模式。|4027553|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|T|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

The choice should be based on the which idiom is best understood.

An array is iterated using:

<pre><code>for (var i = 0; i &lt; a.length; i++)
 //do stuff with a[i]
</code></pre>

An object being used as an associative array is iterated using:

<pre><code>for (var key in o)
 //do stuff with o[key]
</code></pre>

Unless you have earth shattering reasons, stick to the established pattern of usage.

blocks|key|4027584|text|根据您使用的循环类型和浏览器的不同，性能会有所不同。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4027585|例如：|4027586|for+(var+i+=+myArray.length-1;+i+>=+0;+i--)|code-block|syntax|javascript|4027587|在某些浏览器上的速度几乎是两倍于：|4027588|for+(var+i+=+0;+i+<+myArray.length;+i%2B%2B)|4027589|但是，除非您的数组很大，或者您不断地循环它们，否则所有这些都足够快。我严重怀疑数组循环是你的项目(或任何其他项目)中的瓶颈。|4027590|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|T|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

there are performance differences depending on what kind of loop you use and on what browser.

For instance:

<pre><code>for (var i = myArray.length-1; i &gt;= 0; i--)
</code></pre>

is almost twice as fast on some browsers than:

<pre><code>for (var i = 0; i &lt; myArray.length; i++)
</code></pre>

However unless your arrays are HUGE or you loop them constantly all are fast enough. I seriously doubt that array looping is a bottleneck in your project (or for any other project for that matter)

blocks|key|3181056|text|数组上的For+in循环与Prototype不兼容。如果您认为将来可能需要使用该库，那么坚持使用for循环将是有意义的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3181057|http://www.prototypejs.org/api/array|offset|length|3181058|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|10|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@$D|O|E|P|1|Q]]|A|$]]|$1|F|3|-4|5|6|7|R|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|C]]]]

For in loops on Arrays is not compatible with Prototype. If you think you might need to use that library in the future, it would make sense to stick to for loops.

<a href="http://www.prototypejs.org/api/array" rel="nofollow noreferrer">http://www.prototypejs.org/api/array</a>

blocks|key|843688|text|我的第二个意见是，你应该根据你的需要选择迭代方法。我建议您实际上不要通过具有for+in结构的原生Array进行循环。正如Chase+Seibert之前指出的那样，它的和速度要慢得多，与原型框架不兼容。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|BOLD|entityRanges|data|843689|有一个很棒的benchmark+on+different+looping+styles+that+you+absolutely+should+take+a+look+at+if+you+work+with+JavaScript。不要做早期的优化，但你应该把这些东西放在脑后的某个地方。|843690|我会使用for+in来获取对象的所有属性，这在调试脚本时特别有用。例如，当我探索不熟悉的对象时，我喜欢手边有这一行：|843691|l+=+'';+for+(m+in+obj)+{+l+%2B=+m+%2B+'+=>+'+%2B+obj[m]+%2B+'\n'+}+console.log(l);|code-block|syntax|javascript|843692|它将整个对象的内容(连同方法体)转储到我的Firebug日志中。非常方便的。|843693|entityMap|0|LINK|mutability|MUTABLE|url|http://blogs.oracle.com/greimer/entry/best_way_to_code_a^0|12|6|1D|5|2C|1|0|6|2Z|0|0|4|6|0|0|0^^$0|@$1|2|3|4|5|6|7|Z|8|@$9|10|A|11|B|C]|$9|12|A|13|B|C]|$9|14|A|15|B|D]]|E|@]|F|$]]|$1|G|3|H|5|6|7|16|8|@]|E|@$9|17|A|18|1|19]]|F|$]]|$1|I|3|J|5|6|7|1A|8|@$9|1B|A|1C|B|C]]|E|@]|F|$]]|$1|K|3|L|5|M|7|1D|8|@]|E|@]|F|$N|O]]|$1|P|3|Q|5|6|7|1E|8|@]|E|@]|F|$]]|$1|R|3|-4|5|6|7|1F|8|@]|E|@]|F|$]]]|S|$T|$5|U|V|W|F|$X|Y]]]]

I second opinions that you should choose the iteration method according to your need. I would suggest you actually not to ever loop through native <code>Array</code> with <code>for in</code> structure. It is way slower and, as Chase Seibert pointed at the moment ago, not compatible with Prototype framework.

There is an excellent <a href="http://blogs.oracle.com/greimer/entry/best_way_to_code_a" rel="noreferrer">benchmark on different looping styles that you absolutely should take a look at if you work with JavaScript</a>. Do not do early optimizations, but you should keep that stuff somewhere in the back of your head.

I would use <code>for in</code> to get all properties of an object, which is especially useful when debugging your scripts. For example, I like to have this line handy when I explore unfamiliar object:

<pre><code>l = ''; for (m in obj) { l += m + ' =&gt; ' + obj[m] + '\n' } console.log(l);
</code></pre>

It dumps content of the whole object (together with method bodies) to my Firebug log. Very handy.

blocks|key|843711|text|Douglas+Crockford在JavaScript:+The+Good+Parts+(第24页)中建议避免使用for+in语句。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|843712|如果使用for+in遍历对象中的属性名称，则结果是无序的。更糟糕的是:您可能会得到意想不到的结果；它包括从原型链继承的成员和方法的名称。|843713|除了属性之外的所有内容都可以用.hasOwnProperty过滤掉。此代码示例实现了您最初可能想要的功能：|843714|for+(var+name+in+obj)+{
++++if+(Object.prototype.hasOwnProperty.call(obj,+name))+{
++++++++//+DO+STUFF
++++}
}|code-block|syntax|javascript|843715|entityMap|0|LINK|mutability|MUTABLE|url|http://oreilly.com/catalog/9780596517748/^0|1M|6|I|Q|0|0|4|6|0|F|F|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@$9|X|A|Y|B|C]]|D|@$9|Z|A|10|1|11]]|E|$]]|$1|F|3|G|5|6|7|12|8|@$9|13|A|14|B|C]]|D|@]|E|$]]|$1|H|3|I|5|6|7|15|8|@$9|16|A|17|B|C]]|D|@]|E|$]]|$1|J|3|K|5|L|7|18|8|@]|D|@]|E|$M|N]]|$1|O|3|-4|5|6|7|19|8|@]|D|@]|E|$]]]|P|$Q|$5|R|S|T|E|$U|V]]]]

Douglas Crockford recommends in <a href="http://oreilly.com/catalog/9780596517748/" rel="noreferrer">JavaScript: The Good Parts</a> (page 24) to avoid using the <code>for in</code> statement. 

If you use <code>for in</code> to loop over property names in an object, the results are not ordered. Worse: You might get unexpected results; it includes members inherited from the prototype chain and the name of methods.

Everything but the properties can be filtered out with <code>.hasOwnProperty</code>. This code sample does what you probably wanted originally:

<pre><code>for (var name in obj) {
 if (Object.prototype.hasOwnProperty.call(obj, name)) {
 // DO STUFF
 }
}
</code></pre>

blocks|key|3181185|text|我已经看到了使用对象、原型和数组的"for+each“的问题|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3181186|我的理解是，for+each是对象的属性，而不是数组|3181187|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

I have seen problems with the "for each" using objects and prototype and arrays

my understanding is that the for each is for properties of objects and NOT arrays

blocks|key|3181363|text|这是我做的一些事情。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3181364|function+foreach(o,+f)+{
+for(var+i+=+0;+i+<+o.length;+i%2B%2B)+{+//+simple+for+loop
++f(o[i],+i);+//+execute+a+function+and+make+the+obj,+objIndex+available
+}
}|code-block|syntax|javascript|3181365|这就是你使用它的方式|3181366|这将适用于数组和对象(如HTML元素列表)|3181367|foreach(o,+function(obj,+i)+{+//+for+each+obj+in+o
++alert(obj);+//+obj
++alert(i);+//+obj+index
++/*
++++say+if+you+were+dealing+with+an+html+element+may+be+you+have+a+collection+of+divs
++*/
++if(typeof+obj+==+'object')+{+
+++obj.style.marginLeft+=+'20px';
++}
});|3181368|我只是做了这个，所以我对建议持开放态度:)|3181369|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|S|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|T|8|@]|9|@]|A|$]]|$1|K|3|L|5|D|7|U|8|@]|9|@]|A|$E|F]]|$1|M|3|N|5|6|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

here is something i did.

<pre><code>function foreach(o, f) {
 for(var i = 0; i &lt; o.length; i++) { // simple for loop
 f(o[i], i); // execute a function and make the obj, objIndex available
 }
}
</code></pre>

this is how you would use it 
this will work on arrays and objects( such as a list of HTML elements )

<pre><code>foreach(o, function(obj, i) { // for each obj in o
 alert(obj); // obj
 alert(i); // obj index
 /*
 say if you were dealing with an html element may be you have a collection of divs
 */
 if(typeof obj == 'object') { 
 obj.style.marginLeft = '20px';
 }
});
</code></pre>

I just made this so I'm open to suggestions :)

blocks|key|843843|text|仅供参考-+jQuery用户|type|unstyled|depth|inlineStyleRanges|entityRanges|data|843844|843845|默认情况下，jQuery的each(callback)方法使用for(+;+;+)循环，只有当长度为undefined时才使用for(+in+)。|offset|length|style|CODE|843846|因此，我想说在使用这个函数时，假定顺序是正确的是安全的。|843847|示例|BOLD|843848|$(['a','b','c']).each(function()+{
++++alert(this);
});
//Outputs+"a"+then+"b"+then+"c"|code-block|syntax|javascript|843849|使用它的缺点是，如果你在做一些非UI逻辑，你的函数在其他框架上的可移植性将会降低。最好将each()函数与jQuery选择器一起使用，否则建议使用for(+;+;+)函数。|843850|843851|entityMap^0|0|0|D|E|V|A|1E|9|1R|9|0|0|0|2|0|0|18|6|21|A|0|0^^$0|@$1|2|3|4|5|6|7|X|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|C|3|D|5|6|7|Z|8|@$E|10|F|11|G|H]|$E|12|F|13|G|H]|$E|14|F|15|G|H]|$E|16|F|17|G|H]]|9|@]|A|$]]|$1|I|3|J|5|6|7|18|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|19|8|@$E|1A|F|1B|G|M]]|9|@]|A|$]]|$1|N|3|O|5|P|7|1C|8|@]|9|@]|A|$Q|R]]|$1|S|3|T|5|6|7|1D|8|@$E|1E|F|1F|G|H]|$E|1G|F|1H|G|H]]|9|@]|A|$]]|$1|U|3|-4|5|6|7|1I|8|@]|9|@]|A|$]]|$1|V|3|-4|5|6|7|1J|8|@]|9|@]|A|$]]]|W|$]]

<h2>FYI - jQuery Users</h2>

<hr>

jQuery's <code>each(callback)</code> method uses <code>for( ; ; )</code> loop by default, and will use <code>for( in )</code> only if the length is <code>undefined</code>. 

Therefore, I would say it is safe to assume the correct order when using this function.

Example:

<pre><code>$(['a','b','c']).each(function() {
 alert(this);
});
//Outputs "a" then "b" then "c"
</code></pre>

The downside of using this is that if you're doing some non UI logic, your functions will be less portable to other frameworks. The <code>each()</code> function is probably best reserved for use with jQuery selectors and <code>for( ; ; )</code> might be advisable otherwise.

<hr>

blocks|key|4028084|text|如果你真的想要加速你的代码，那该怎么办？|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4028085|for(+var+i=0,j=null;+j=array[i%2B%2B];+foo(j)+);|code-block|syntax|javascript|4028086|这在某种程度上是在for语句中使用while逻辑，而且冗余较少。火狐也有Array.forEach和Array.filter|4028087|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

If you really want to speed up your code, what about that?

<pre><code>for( var i=0,j=null; j=array[i++]; foo(j) );
</code></pre>

it's kinda of having the while logic within the for statement and it's less redundant. Also firefox has Array.forEach and Array.filter

blocks|key|4028146|text|请注意，本机Array.forEach方法现在是widely+supported。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4028147|entityMap|0|LINK|mutability|MUTABLE|url|http://kangax.github.com/es5-compat-table/^0|O|G|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

Note that the native Array.forEach method is now <a href="http://kangax.github.com/es5-compat-table/">widely supported</a>.

blocks|key|5439432|text|当数组是稀疏的时，这两者是不同的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5439433|var+array+=+[0,+1,+2,+,+,+5];

for+(var+k+in+array)+{
++//+Not+guaranteed+by+the+language+spec+to+iterate+in+order.
++alert(k);++//+Outputs+0,+1,+2,+5.
++//+Behavior+when+loop+body+adds+to+the+array+is+unclear.
}

for+(var+i+=+0;+i+<+array.length;+%2B%2Bi)+{
++//+Iterates+in+order.
++//+i+is+a+number,+not+a+string.
++alert(i);++//+Outputs+0,+1,+2,+3,+4,+5
++//+Behavior+when+loop+body+modifies+array+is+clearer.
}|code-block|syntax|javascript|5439434|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

The two are not the same when the array is sparse.

<pre><code>var array = [0, 1, 2, , , 5];

for (var k in array) {
 // Not guaranteed by the language spec to iterate in order.
 alert(k); // Outputs 0, 1, 2, 5.
 // Behavior when loop body adds to the array is unclear.
}

for (var i = 0; i &lt; array.length; ++i) {
 // Iterates in order.
 // i is a number, not a string.
 alert(i); // Outputs 0, 1, 2, 3, 4, 5
 // Behavior when loop body modifies array is clearer.
}
</code></pre>

blocks|key|843995|text|更新的答案2012当前版本的所有主要浏览器-+Chrome，火狐，IE9，Safari和OperaES5的原生array.forEach支持。|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|843996|除非你有一些原生支持IE8的理由(请记住，ES5-shim或Chrome+frame可以提供给这些用户，这将提供一个适当的JS环境)，简单地使用该语言的正确语法会更干净：|843997|myArray.forEach(function(item,+index)+{
++++console.log(item,+index);
});|code-block|syntax|javascript|843998|Full+documentation+for+array.forEach()+is+at+MDN.|843999|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/forEach^0|0|9|0|0|0|0|1D|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|Z|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|10|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|11|8|@]|D|@$9|12|A|13|1|14]]|E|$]]|$1|O|3|-4|5|6|7|15|8|@]|D|@]|E|$]]]|P|$Q|$5|R|S|T|E|$U|V]]]]

Updated answer for 2012 current version of all major browsers - Chrome, Firefox, IE9, Safari and Opera support ES5's native array.forEach.

Unless you have some reason to support IE8 natively (keeping in mind ES5-shim or Chrome frame can be provided to these users, which will provide a proper JS environment), it's cleaner to simply use the language's proper syntax:

<pre><code>myArray.forEach(function(item, index) {
 console.log(item, index);
});
</code></pre>

<a href="https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/forEach" rel="nofollow">Full documentation for array.forEach() is at MDN.</a>

blocks|key|5439555|text|使用forEach跳过原型链|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|5439556|这只是对@nailer's+answer+above的一个快速补充，使用forEach和Object.keys意味着您可以避免在原型链上迭代，而不必使用hasOwnProperty。|5439557|var+Base+=+function+()+{
++++this.coming+=+"hey";
};

var+Sub+=+function+()+{
++++this.leaving+=+"bye";
};

Sub.prototype+=+new+Base();
var+tst+=+new+Sub();

for+(var+i+in+tst)+{
++++console.log(tst.hasOwnProperty(i)+%2B+i+%2B+tst[i]);
}

Object.keys(tst).forEach(function+(val)+{
++++console.log(val+%2B+tst[val]);
});|code-block|syntax|javascript|5439558|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/a/8826575/648802^0|0|E|0|4|M|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@$9|V|A|W|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|X|8|@]|D|@$9|Y|A|Z|1|10]]|E|$]]|$1|H|3|I|5|J|7|11|8|@]|D|@]|E|$K|L]]|$1|M|3|-4|5|6|7|12|8|@]|D|@]|E|$]]]|N|$O|$5|P|Q|R|E|$S|T]]]]

Using forEach to skip the prototype chain 

Just a quick addendum to <a href="https://stackoverflow.com/a/8826575/648802">@nailer's answer above</a>, using forEach with Object.keys means you can avoid iterating over the prototype chain without having to use hasOwnProperty. 

<pre><code>var Base = function () {
 this.coming = "hey";
};

var Sub = function () {
 this.leaving = "bye";
};

Sub.prototype = new Base();
var tst = new Sub();

for (var i in tst) {
 console.log(tst.hasOwnProperty(i) + i + tst[i]);
}

Object.keys(tst).forEach(function (val) {
 console.log(val + tst[val]);
});
</code></pre>

blocks|key|3181722|text|使用数组().forEach循环来利用并行性|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3181723|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Use the Array().forEach loop to take advantage of parallelism

blocks|key|4028439|text|小心!|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4028440|例如，如果您有几个脚本标记，并且要在标记属性中搜索信息，则必须使用带有for循环的.length属性，因为它不是一个简单的数组，而是一个HTMLCollection对象。|4028441|https://developer.mozilla.org/en/DOM/HTMLCollection|offset|length|4028442|如果你使用FORACH语句(在yourList中是var+i)，它将返回大多数浏览器中HTMLCollection的属性和方法！|4028443|var+scriptTags+=+document.getElementsByTagName("script");

for(var+i+=+0;+i+<+scriptTags.length;+i%2B%2B)
alert(i);+//+Will+print+all+your+elements+index+(you+can+get+src+attribute+value+using+scriptTags[i].attributes[0].value)

for(var+i+in+scriptTags)
alert(i);+//+Will+print+"length",+"item"+and+"namedItem"+in+addition+to+your+elements!|code-block|syntax|javascript|4028444|即使getElementsByTagName应该返回NodeList，大多数浏览器也会返回HTMLCollection：https://developer.mozilla.org/en/DOM/document.getElementsByTagName|4028445|entityMap|0|LINK|mutability|MUTABLE|url|1|https://developer.mozilla.org/en/DOM/document.getElementsByTagName^0|0|0|0|1F|0|0|0|0|1O|1U|1|0^^$0|@$1|2|3|4|5|6|7|Z|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|10|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|11|8|@]|9|@$F|12|G|13|1|14]]|A|$]]|$1|H|3|I|5|6|7|15|8|@]|9|@]|A|$]]|$1|J|3|K|5|L|7|16|8|@]|9|@]|A|$M|N]]|$1|O|3|P|5|6|7|17|8|@]|9|@$F|18|G|19|1|1A]]|A|$]]|$1|Q|3|-4|5|6|7|1B|8|@]|9|@]|A|$]]]|R|$S|$5|T|U|V|A|$W|E]]|X|$5|T|U|V|A|$W|Y]]]]

Watch out!

If you have several script tags and your're searching an information in tag attributes for example, you have to use .length property with a for loop because it isn't a simple array but an HTMLCollection object.

<a href="https://developer.mozilla.org/en/DOM/HTMLCollection" rel="nofollow">https://developer.mozilla.org/en/DOM/HTMLCollection</a>

If you use the foreach statement for(var i in yourList) it will return proterties and methods of the HTMLCollection in most browsers!

<pre><code>var scriptTags = document.getElementsByTagName("script");

for(var i = 0; i &lt; scriptTags.length; i++)
alert(i); // Will print all your elements index (you can get src attribute value using scriptTags[i].attributes[0].value)

for(var i in scriptTags)
alert(i); // Will print "length", "item" and "namedItem" in addition to your elements!
</code></pre>

Even if getElementsByTagName should return a NodeList, most browser are returning an HTMLCollection:
<a href="https://developer.mozilla.org/en/DOM/document.getElementsByTagName" rel="nofollow">https://developer.mozilla.org/en/DOM/document.getElementsByTagName</a>

blocks|key|4028514|text|小心！我在Mac+OS中使用Chrome+22.0，for+each语法有问题。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4028515|我不知道这是浏览器的问题，javascript的问题，还是代码中的一些错误，但这是非常奇怪的。在对象之外，它可以完美地工作。|4028516|var+MyTest+=+{
++++a:string+=+"a",
++++b:string+=+"b"
};

myfunction+=+function(dicts)+{
++++for+(var+dict+in+dicts)+{
++++++++alert(dict);
++++++++alert(typeof+dict);+//+print+'string'+(incorrect)
++++}

++++for+(var+i+=+0;+i+<+dicts.length;+i%2B%2B)+{
++++++++alert(dicts[i]);
++++++++alert(typeof+dicts[i]);+//+print+'object'+(correct,+it+must+be+{abc:+"xyz"})
++++}
};

MyObj+=+function()+{
++++this.aaa+=+function()+{
++++++++myfunction([MyTest]);
++++};
};
new+MyObj().aaa();+//+This+does+not+work

myfunction([MyTest]);+//+This+works|code-block|syntax|javascript|4028517|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Be careful!!!
I am using Chrome 22.0 in Mac OS and I am having problem with the for each syntax.

I do not know if this is a browser issue, javascript issue or some error in the code, but it is VERY strange. Outside of the object it works perfectly.

<pre><code>var MyTest = {
 a:string = "a",
 b:string = "b"
};

myfunction = function(dicts) {
 for (var dict in dicts) {
 alert(dict);
 alert(typeof dict); // print 'string' (incorrect)
 }

 for (var i = 0; i &lt; dicts.length; i++) {
 alert(dicts[i]);
 alert(typeof dicts[i]); // print 'object' (correct, it must be {abc: "xyz"})
 }
};

MyObj = function() {
 this.aaa = function() {
 myfunction([MyTest]);
 };
};
new MyObj().aaa(); // This does not work

myfunction([MyTest]); // This works
</code></pre>

blocks|key|5439782|text|根据jsperf，一个更短、更好的代码是|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5439783|keys++=+Object.keys(obj);
for+(var+i+=+keys.length;+i--;){
+++value+=+obj[keys[i]];//+or+other+action
}|code-block|syntax|javascript|5439784|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

A shorter and best code according to jsperf is

<pre><code>keys = Object.keys(obj);
for (var i = keys.length; i--;){
 value = obj[keys[i]];// or other action
}
</code></pre>

blocks|key|4028613|text|用于(；；)的适用于阵列：20,55,33|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|4028614|for..in用于对象：{x:20，y:55:z:33}|4028615|entityMap^0|7|E|0|0|S|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|M|8|@$9|N|A|O|B|C]]|D|@]|E|$]]|$1|H|3|-4|5|6|7|P|8|@]|D|@]|E|$]]]|I|$]]

for(;;) is for Arrays : [20,55,33]

for..in is for Objects : {x:20,y:55:z:33}

blocks|key|3182049|text|两者之间有一个重要的区别。for-in遍历对象的属性，因此当情况是一个数组时，它不仅会遍历它的元素，还会遍历它拥有的"remove“函数。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3182050|for+(var+i+=+0;+i+<+myArray.length;+i%2B%2B)+{+
++++console.log(i)+
}

//Output
0
1

for+(var+i+in+myArray)+{+
++++console.log(i)+
}+

//+Output
0+
1+
remove|code-block|syntax|javascript|3182051|您可以使用带有if(myArray.hasOwnProperty(i))的for-in。尽管如此，在迭代数组时，我总是倾向于避免这种情况，只使用for(;;)语句。|offset|length|style|CODE|3182052|entityMap^0|0|0|7|T|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

There is an important difference between both. The for-in iterates over the properties of an object, so when the case is an array it will not only iterate over its elements but also over the "remove" function it has.

<pre><code>for (var i = 0; i &lt; myArray.length; i++) { 
 console.log(i) 
}

//Output
0
1

for (var i in myArray) { 
 console.log(i) 
} 

// Output
0 
1 
remove
</code></pre>

You could use the for-in with an <code>if(myArray.hasOwnProperty(i))</code>. Still, when iterating over arrays I always prefer to avoid this and just use the for(;;) statement.

blocks|key|844164|text|虽然它们非常相似，但有一个小的区别：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|844165|var+array+=+["a",+"b",+"c"];
array["abc"]+=+123;
console.log("Standard+for+loop:");
for+(var+index+=+0;+index+<+array.length;+index%2B%2B)
{
++console.log("+array["+%2B+index+%2B+"]+=+"+%2B+array[index]);+//Standard+for+loop
}|code-block|syntax|javascript|844166|在这种情况下，输出为：|844167|循环标准：|844168|数组=A|844169|ARRAY1+=B|844170|ARRAY2+=C|844171|console.log("For-in+loop:");
for+(var+key+in+array)
{
++console.log("+array["+%2B+key+%2B+"]+=+"+%2B+array[key]);+//For-in+loop+output
}|844172|而在这种情况下，输出是：|844173|FOR-IN循环：|844174|ARRAY1+=B|844175|ARRAY2+=C|844176|ARRAY10+=D|844177|ARRAYABC+=+123|844178|entityMap^0|0|0|0|0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|16|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|17|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|18|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|19|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|1A|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|1B|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|1C|8|@]|9|@]|A|$]]|$1|Q|3|R|5|D|7|1D|8|@]|9|@]|A|$E|F]]|$1|S|3|T|5|6|7|1E|8|@]|9|@]|A|$]]|$1|U|3|V|5|6|7|1F|8|@]|9|@]|A|$]]|$1|W|3|X|5|6|7|1G|8|@]|9|@]|A|$]]|$1|Y|3|Z|5|6|7|1H|8|@]|9|@]|A|$]]|$1|10|3|11|5|6|7|1I|8|@]|9|@]|A|$]]|$1|12|3|13|5|6|7|1J|8|@]|9|@]|A|$]]|$1|14|3|-4|5|6|7|1K|8|@]|9|@]|A|$]]]|15|$]]

Although they both are very much alike there is a minor difference :

<pre><code>var array = ["a", "b", "c"];
array["abc"] = 123;
console.log("Standard for loop:");
for (var index = 0; index &lt; array.length; index++)
{
 console.log(" array[" + index + "] = " + array[index]); //Standard for loop
}
</code></pre>

in this case the output is :

STANDARD FOR LOOP:

ARRAY[0] = A

ARRAY[1] = B

ARRAY[2] = C

<pre><code>console.log("For-in loop:");
for (var key in array)
{
 console.log(" array[" + key + "] = " + array[key]); //For-in loop output
}
</code></pre>

while in this case the output is:

FOR-IN LOOP:

ARRAY[1] = B

ARRAY[2] = C

ARRAY[10] = D

ARRAY[ABC] = 123

Do you think there is a big difference in for...in and for loops? What kind of "for" do you prefer to use and why?

Let's say we have an array of associative arrays:

<pre><code>var myArray = [{'key': 'value'}, {'key': 'value1'}];
</code></pre>

So we can iterate:

<pre><code>for (var i = 0; i &lt; myArray.length; i++)
</code></pre>

And:

<pre><code>for (var i in myArray)
</code></pre>

I don't see a big difference. Are there any performance issues?

JavaScript for...in vs for

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

你认为for...in和for循环有很大的区别吗？你更喜欢使用哪种"for“？为什么？假设我们有一个关联数组的数组：var myArray = [{'key': 'value'}, {'key': 'value1'}];所以我们可以迭代：for (var i = 0; i < myArray.length; i++)和...

问JavaScript for...in与
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JavaScript for...in与EN