This is different from the way current modern browsers work, which iterate arrays based on the indices in ascending order. This is especially essential if you’re looking to support browsers like IE, which iterates in the order the items are created rather than in the order of the indices. Orderly iterating of arraysĪs the index order in the iterations is not guaranteed when using the for.in loop, it’s recommended to not iterate arrays if maintaining the order is necessary. Now let’s look at situations where a for.in loop isn’t the best option. So, the order of the properties accessed might not be as expected. When using the for.in loop for debugging objects and their values, you should always keep in mind that iterations are not orderly, meaning that the order of items that the loop iterates can be random. In this case, the for.in loop is a good choice. For example, you may want to print to the console or an HTML element the properties of an object and its values. Debugging with a for…in loopĪnother good use case for the JavaScript for.in loop is debugging. A for.in loop provides an easy way to iterate over an object’s properties and ultimately its values. Iterating objects with a JavaScript for…in loopīecause the for.in loop only iterates the enumerable properties of an object - which are the object’s own properties rather than properties like toString that are part of the object’s prototype - it’s good to use a for.in loop to iterate objects. Let’s look at the situations that the JavaScript for.in loop is best suited to. Inside the loop, we’re rendering the key, or index of each character, and the character at that index. In the following example, we’re looping over the variable obj and logging each property and value: const obj = //Output // '0: H' // '1: e' // '2: l' // '3: l' // '4: o' // '5: !' When using for.in loop to iterate an object in JavaScript, the iterated keys or properties - which, in the snippet above, are represented by the key variable - are the object’s own properties.Īs objects might inherit items through the prototype chain, which includes the default methods and properties of Objects as well as Object prototypes we might define, we should then use hasOwnProperty.

Javascript for each syntax