for...in

  • Revision slug: JavaScript/Reference/Statements/for...in
  • Revision title: for...in
  • Revision id: 7867
  • Created:
  • Creator: Grauw
  • Is current revision? No
  • Comment /* Parameters */ Clarify that the locality bit only applies when you use the var keyword

Revision Content

Summary

Iterates a specified variable over all the properties of an object, in arbitrary order. For each distinct property, the specified statement is executed.

Statement
Implemented in: JavaScript 1.0, NES 2.0
ECMA Version: ECMA-262

Syntax

for (variable in object)
  statement
for (var variable in object)
  statement

Parameters

variable 
Variable to iterate over every property, optionally declared with the var keyword. If the var keyword is present, note that the variable is local to the function, not to the loop. (In other words, when the loop completes the variable has the value of the last property visited.)
object 
Object for which the properties are iterated.
statement 
A statement to execute for each property. To execute multiple statements within the loop, use a block statement ({ ... }) to group those statements.

Description

A for...in loop does not iterate over built-in properties. These include all built-in methods of objects, such as String's indexOf method or Object's toString method. However, the loop will iterate over all user-defined properties (including any which overwrite built-in properties).

A for...in loop iterates over the properties of an object in an arbitrary order. If a property is modified in one iteration and then visited at a later time, the value exposed by the loop will be its value at that later time. A property which is deleted before it has been visited will not then be visited later. Properties added to the object over which iteration is occurring may either be visited or omitted from iteration. In general it is best not to add, modify, or remove properties from the object during iteration, other than the property currently being visited; there is no guarantee whether or not an added property will be visited, whether a modified property will be visited before or after it is modified, or whether a deleted property will be visited before it is deleted.

Although it may be tempting to use this as a way to iterate over an Array, this is a bad idea. The for...in statement iterates over user-defined properties in addition to the array elements, so if you modify the array's non-integer or non-positive properties (e.g. by adding a "foo" property to it or even by adding a method or property to Array.prototype), the for...in statement will return the name of your user-defined properties in addition to the numeric indexes. Also, because order of iteration is arbitrary, iterating over an array may not visit elements in numeric order. Thus it is better to use a traditional for loop with a numeric index when iterating over arrays.

Examples

Example: Using for...in

The following function takes as its arguments an object and the object's name. It then iterates over all the object's properties and returns a string that lists the property names and their values.

function show_props(obj, objName) {
   var result = "";
   for (var i in obj) {
      result += objName + "." + i + " = " + obj[i] + "\n";
   }
   return result;
}

See also



{{ wiki.languages( { "es": "es/Referencia_de_JavaScript_1.5/Sentencias/for...in", "fr": "fr/R\u00e9f\u00e9rence_de_JavaScript_1.5_Core/Instructions/for...in", "ja": "ja/Core_JavaScript_1.5_Reference/Statements/for...in", "pl": "pl/Dokumentacja_j\u0119zyka_JavaScript_1.5/Polecenia/for...in" } ) }}

Revision Source

<p>
</p>
<h3 name="Summary"> Summary </h3>
<p>Iterates a specified variable over all the properties of an object, in arbitrary order. For each distinct property, the specified statement is executed.
</p>
<table class="fullwidth-table">
<tbody><tr>
<td class="header" colspan="2">Statement</td>
</tr>
<tr>
<td>Implemented in:</td>
<td>JavaScript 1.0, NES 2.0</td>
</tr>
<tr>
<td>ECMA Version:</td>
<td>ECMA-262
</td>
</tr>
</tbody></table>
<h3 name="Syntax"> Syntax </h3>
<pre class="eval">for (<i>variable</i> in <i>object</i>)
  <i>statement</i>
</pre>
<pre class="eval">for (var <i>variable</i> in <i>object</i>)
  <i>statement</i>
</pre>
<h3 name="Parameters"> Parameters </h3>
<dl><dt> <code>variable</code> </dt><dd> Variable to iterate over every property, optionally declared with the <code>var</code> keyword. If the <code>var</code> keyword is present, note that the variable is local to the function, not to the loop. (In other words, when the loop completes the variable has the value of the last property visited.)
</dd></dl>
<dl><dt> <code>object</code> </dt><dd> Object for which the properties are iterated.  
</dd></dl>
<dl><dt> <code>statement</code> </dt><dd> A statement to execute for each property. To execute multiple statements within the loop, use a <a href="en/Core_JavaScript_1.5_Reference/Statements/block">block</a> statement (<code>{ ... }</code>) to group those statements.
</dd></dl>
<h3 name="Description"> Description </h3>
<p>A <code>for...in</code> loop does not iterate over built-in properties. These include all built-in methods of objects, such as <code><a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code>'s <code><a href="en/Core_JavaScript_1.5_Reference/Global_Objects/String/indexOf">indexOf</a></code> method or <code><a href="en/Core_JavaScript_1.5_Reference/Global_Objects/Object">Object</a></code>'s <code><a href="en/Core_JavaScript_1.5_Reference/Global_Objects/Object/toString">toString</a></code> method.  However, the loop will iterate over all user-defined properties (including any which overwrite built-in properties).
</p><p>A <code>for...in</code> loop iterates over the properties of an object in an arbitrary order.  If a property is modified in one iteration and then visited at a later time, the value exposed by the loop will be its value at that later time.  A property which is deleted before it has been visited will not then be visited later.  Properties added to the object over which iteration is occurring may either be visited or omitted from iteration.  In general it is best not to add, modify, or remove properties from the object during iteration, other than the property currently being visited; there is no guarantee whether or not an added property will be visited, whether a modified property will be visited before or after it is modified, or whether a deleted property will be visited before it is deleted.
</p>
<div class="note">
<p>Although it may be tempting to use this as a way to iterate over an <a href="en/Core_JavaScript_1.5_Reference/Global_Objects/Array">Array</a>, this is a bad idea.  The <code>for...in</code> statement iterates over user-defined properties in addition to the array elements, so if you modify the array's non-integer or non-positive properties (e.g. by adding a <code>"foo"</code> property to it or even by adding a method or property to <code>Array.prototype</code>), the <code>for...in</code> statement will return the name of your user-defined properties in addition to the numeric indexes. Also, because order of iteration is arbitrary, iterating over an array may not visit elements in numeric order.  Thus it is better to use a traditional <a href="en/Core_JavaScript_1.5_Reference/Statements/for">for</a> loop with a numeric index when iterating over arrays.
</p>
</div>
<h3 name="Examples"> Examples </h3>
<h4 name="Example:_Using_for...in"> Example: Using <code>for...in</code> </h4>
<p>The following function takes as its arguments an object and the object's name. It then iterates over all the object's properties and returns a string that lists the property names and their values.
</p>
<pre class="eval">function show_props(obj, objName) {
   var result = "";
   for (var i in obj) {
      result += objName + "." + i + " = " + obj[i] + "\n";
   }
   return result;
}
</pre>
<h3 name="See_also"> See also </h3>
<ul><li> <a href="en/Core_JavaScript_1.5_Reference/Statements/for_each...in">for each...in</a> - similar to <code>for...in</code>, but iterates over the values of object's properties, rather than the property names themselves. (<a href="en/New_in_JavaScript_1.6">New in JavaScript 1.6</a>.)
</li><li> <a href="en/Core_JavaScript_1.5_Reference/Statements/for">for</a>
</li></ul>
<p><br>
</p><p><br>
</p>
<div class="noinclude">
</div>
{{ wiki.languages( { "es": "es/Referencia_de_JavaScript_1.5/Sentencias/for...in", "fr": "fr/R\u00e9f\u00e9rence_de_JavaScript_1.5_Core/Instructions/for...in", "ja": "ja/Core_JavaScript_1.5_Reference/Statements/for...in", "pl": "pl/Dokumentacja_j\u0119zyka_JavaScript_1.5/Polecenia/for...in" } ) }}
Revert to this revision