js中的循环遍历方法对比

JS循环大总结， for, forEach，for in，for of, map区别

map（数组方法）：

特性：

map不改变原数组但是会 返回新数组

可以使用break中断循环，可以使用return返回到外层函数

实例：

let newarr=arr.map(i=>{

return i+=1;

console.log(i);

})

console.log(arr)//1,3,4---不会改变原数组

console.log(newarr)//[2,4,5]---返回新数组

forEach（数组方法）：

特性：

便利的时候更加简洁，效率和for循环相同，不用关心集合下标的问题，减少了出错的概率。

没有返回值

不能使用break中断循环，不能使用return返回到外层函数

实例：

let newarr=arr.forEach(i=>{

i+=1;

console.log(i);//2,4,5

})

console.log(arr)//[1,3,4]

console.log(newarr)//undefined

注意：

forEach() 对于空数组是不会执行回调函数的。

for可以用continue跳过循环中的一个迭代，forEach用continue会报错。

forEach() 需要用 return 跳过循环中的一个迭代，跳过之后会执行下一个迭代。

for in(大部分用于对象)：

用于循环遍历数组或对象属性

特性：

可以遍历数组的键名，遍历对象简洁方便 ###实例：

  let person={name:"小白",age:28,city:"北京"}

  let text=""

  for (let i in person){

      text+=person[i]

  }

  输出结果为：小白28北京

//其次在尝试一些数组

  let arry=[1,2,3,4,5]

  for (let i in arry){

        console.log(arry[i])

    }

//能输出出来，证明也是可以的

for of（不能遍历对象）：

特性：

（可遍历map，object,array,set string等）用来遍历数据，比如组中的值

避免了for in的所有缺点，可以使用break,continue和return，不仅支持数组的遍历，还可以遍历类似数组的对象。

  let arr=["nick","freddy","mike","james"];

    for (let item of arr){

        console.log(item)

    }

//暑促结果为nice freddy mike james

//遍历对象

  let person={name:"老王",age:23,city:"唐山"}

  for (let item of person){

        console.log(item)

    }

//我们发现它是不可以的

//但是它和forEach有个解决方法，结尾介绍

总结：

forEach 遍历列表值,不能使用 break 语句或使用 return 语句

for in 遍历对象键值(key),或者数组下标,不推荐循环一个数组

for of 遍历列表值,允许遍历 Arrays（数组）, Strings（字符串）, Maps（映射）, Sets（集合）等可迭代的数据结构等.在 ES6 中引入的 for of 循环，以替代 for in 和 forEach() ，并支持新的迭代协议。

for in循环出的是key，for of循环出的是value；

for of是ES6新引入的特性。修复了ES5的for in的不足；

for of不能循环普通的对象，需要通过和Object.keys()搭配使用。