当我们需要遍历一个数组时，第一个想到的就是for，然后用length去判断条件，之后++，但着似乎有些过于老套了。本文主要收集各种遍历方法，主要针对数组，也会有关于对象、字符串的，看完它，你会对遍历有一个新的认识。

params

const ArrayList = [  {
   name: '张三', age: 18},  {
   name: '李四', age: 20}]const ObjectParams = {  name: '孙晓萌',  age: '19'}const StringParams = '女帝'复制代码

基础for循环

最传统的for{.....}

// 遍历Arrayfor (let i = 0; i < ArrayList.length; i++) {  console.log(ArrayList[i])}// 遍历Object// 你会发现它并没有走进这个for循环，因为ObjectParams.length === undefinedfor (let i = 0; i < ObjectParams.length; i++) {  console.log(ObjectParams[i])}// 遍历Stringfor (let i = 0; i < StringParams.length; i++) {  console.log(StringParams[i])}复制代码

for in 循环为遍历数组而生

全能了... 可以遍历数组、对象、字符串

for (let i in ArrayList) {  console.log(ArrayList[i])   // i输出为index}for (let i in ObjectParams) {  console.log(ObjectParams[i])  // i输出为key}for (let i in StringParams) {  console.log(StringParams[i])  // i输出为index}复制代码

for of 循环

es6引入的

for...of语句在可迭代对象(包括 Array, Map, Set, String, TypedArray，arguments 对象等等)上创建一个迭代循环，对每个不同属性的属性值,调用一个自定义的有执行语句的迭代挂钩。。。for...of循环本质上就是调用这个接口产生的遍历器. [for...of](http://es6.ruanyifeng.com/#docs/iterator)

for (let i of ArrayList) {  console.log(i)   }// 数组原生具备iterator接口（即默认部署了Symbol.iterator属性），for...of循环本质上就是调用这个接口产生的遍历器ObjectParams[Symbol.iterator] = ArrayList[Symbol.iterator].bind(ArrayList)for (let i of ObjectParams) {  console.log(i)  // 输出结果与直接遍历ArrayList一样，Object默认是不具备Symbol.iterator属性的，因此无法对Object用for of进行遍历}  for (let i of StringParams) {  console.log(i)  }复制代码

forEach循环

数组特有... 不可break。 forEach()方法是ES5.1标准引入的。

ArrayList.forEach((item, index) => {  console.log(item, index)  // item当前下标对象  index下标})复制代码

while循环

let i = 0while (i < ArrayList.length){  console.log(ArrayList[i])  i++}let j = 0// 你会发现它并没有走进这个while循环，因为ObjectParams.length === undefinedwhile (j < ObjectParams.length){  console.log(ObjectParams[j])  j++}let k = 0while (k < StringParams.length){  console.log(StringParams[k])  k++}复制代码

do while 循环

let i = 0do {  console.log(ArrayList[i])  i++}while (i < ArrayList.length)  let j = 0do {  console.log(ObjectParams) //会输出 因为do while是先走do语句  j++}// 你会发现它并没有走进这个while循环，因为ObjectParams.length === undefinedwhile (j < ObjectParams.length)let k = 0do {  console.log(StringParams[k])  k++}while (k < StringParams.length)  复制代码

map

数组特有... 不可break

ArrayList.map((item, index) => {  console.log(item, index)})复制代码

跳出for循环

break 语句用于跳出循环。上述几种方法中forEach和map不支持break.. continue 用于跳过循环中的一个迭代。上述几种方法中forEach和map不支持continue..

总结

遍历数组用forEach、map（如果你不需要中断它），需要中断的话就选for...of吧遍历字符串for..of, for...in 遍历对象for...in while和do while的区别 while先判断条件，do while先执行一次再判断条件。

个人博客：