Detailed explanation of the difference between for of and for in

Traversing arrays usually uses a for loop. If you use ES5, you can also use forEach. ES5 has the functions of traversing arrays such as map, filter, some, every, reduce, reduceRight, etc., but their return results are different. However, if you use foreach to traverse the array, you cannot interrupt the loop using break, and you cannot return to the outer function using return.

Array.prototype.method=function(){
　　console.log(this.length);
}
var myArray=[1,2,4,5,6,7]
myArray.name="数组"
for (var index in myArray) {
  console.log(myArray[index]);
}

Using for in can also traverse the array, but there will be the following problems:

1. The index is a string number and cannot directly perform geometric operations

2. The traversal order may not be according to the internal order of the actual array

3. Using for in will traverse all enumerable properties of the array, including the prototype. For example, Shangli's prototype method method and name attribute are

, so for in is more suitable for traversing objects. Do not use for in to traverse arrays.

In addition to using a for loop, how can we traverse the array more simply and correctly to achieve our expectations (that is, without traversing method and name), the for of in ES6 is even better.

Array.prototype.method=function(){
　　console.log(this.length);
}
var myArray=[1,2,4,5,6,7]
myArray.name="数组";
for (var value of myArray) {
  console.log(value);
}

Remember, for in traverses the index (i.e. key name) of the array, while for of traverses the array element values.

for of only traverses the elements in the array, not including the prototype attribute method and index name of the array

Traversing objects usually uses for in to traverse the key name of the object

Object.prototype.method=function(){
　　console.log(this);
}
var myObject={
　　a:1,
　　b:2,
　　c:3
}
for (var key in myObject) {
  console.log(key);
}

for in can traverse to the prototype method method of myObject. If you don’t want to traverse the prototype method and properties, you can judge it inside the loop. The hasOwnPropery method can determine whether a certain property is an instance property of the object.

for (var key in myObject) {
　　if（myObject.hasOwnProperty(key)){
　　　　console.log(key);
　　}
}

Same You can get an array of instance properties of an object through ES5's Object.keys(myObject), excluding prototype methods and properties.

Object.prototype.method=function(){
　　console.log(this);
}
var myObject={
　　a:1,
　　b:2,
　　c:3
}
Object.keys(myObject).forEach(function(key,index){<br>　　console.log(key,myObject[key])<br>})

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