JS循环遍历数组|对象:for...in ,for...of,forEach,for

循环遍历数组的方法：

for...in ~ES5

遍历key值，遍历对象和数组

1.数组

for(let index in array) {  
    console.log(index,array[index]);  
};  

2.对象：为循环“enumerable”对象设计的

var A = {a:1,b:2,c:3,d:"hello world"};  
for(let k in A) {  
    console.log(k,A[k]);  
} 

for...of ~ES6

• 可以使用终止循环执行的方法：break、continue、return 和 throw

const iterable = ['aa', 'bb', 'cc']; 
//iterable可迭代的；可迭代对象；可遍历对象
for (const value of iterable) {
  console.log(value);
  break;
}
// aa  break 关键字在一次执行后终止循环

• 支持Array，Map，Set，String，TypedArray，arguments 对象的遍历，循环读取键值

类数组：Map，Set

for...of是es6标准，用来遍历value值，遍历数组，

• for...of 循环仅适用于迭代,而普通对象不可迭代。

1.for...of对普通对象进行操作：
const obj = { fname: 'foo', lname: 'bar' }; 
for (const value of obj) { 
    console.log(value);
}
// TypeError: obj[Symbol.iterator] is not a function
2.将类数组(array-like)对象转换为数组来绕过它。该对象将具有一个 length 属性，其元素必须可以被索引。
const obj = { length: 3, 0: 'foo', 1: 'bar', 2: 'baz' };
const array = Array.from(obj);
for (const value of array) { 
    console.log(value);
}
// foo
// bar
// baz
Array.from() 方法可以让我通过类数组(array-like)或可迭代对象来创建一个新的 Array(数组) 实例。

1.数组
const array = ['a', 'b', 'c'];
for(let v of array) {  
    console.log(v);  
}; 
-------------------------------- 
2.字符串  
let s = "helloabc"; 
for(let c of s) {  
  console.log(c); 
 }
-------------------------------- 

3.Map
Map 对象就是保存 key-value(键值) 对。对象和原始值可以用作 key(键)或 value(值)。Map 对象根据其插入方式迭代元素。换句话说， for...of 循环将为每次迭代返回一个 key-value(键值) 数组。


let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]);
for (let entry of iterable) {
  console.log(entry);
}
// ["a", 1]
// ["b", 2]
// ["c", 3]
for (let [key, value] of iterable) {
  console.log(value);
}
// 1
// 2
// 3
-------------------------------- 

4.set
Set(集合) 对象允许你存储任何类型的唯一值，这些值可以是原始值或对象。 Set(集合) 对象只是值的集合。 Set(集合) 元素的迭代基于其插入顺序。 Set(集合) 中的值只能发生一次。如果您创建一个具有多个相同元素的 Set(集合) ，那么它仍然被认为是单个元素。


let iterable = new Set([1, 1, 2, 2, 3, 3]);
for (let value of iterable) {
  console.log(value);
}
// 1
// 2
// 3
-------------------------------- 

5.arguments对象
(function() {
  for (let argument of arguments) {
    console.log(argument);
  }
})(1, 2, 3);
// 1
// 2
// 3

for...in,for...of的区别？

• for...in遍历key值，for...of遍历value值
• for...in可以遍历对象、数组，但是一般不推荐遍历数组，for...of不能遍历普通对象

forEach

不能使用break语句跳出循环，或者使用return从函数体内返回

array.forEach(v=>{  
    console.log(v);  
});
array.forEach（function(v){  
    console.log(v);  
});

for 基本

var array = [1,2,3,4,5,6,7];  
for (var i = 0; i < array.length; i) {  
    console.log(i,array[i]);  
}