见使用的遍历函数

使用for-of循环(ES2015+) - 异步友好

使用forEach/some - 异步不友好(见例子)

使用for - 异步友好

几点注意

不使用map，除非你用不到循环的返回值，请注意map和forEach是有区别的，map主要用来生成一个新的数组。

异步谨慎使用forEach，如果回调做异步工作，需要forEach等待（但是forEach不会等待，而是直接到底）。

数组遍历例子

for-of (ES2015+)

用法简单直接，使用let把单个变量的范围进行限制，不会影响到循环外，而且性能优于forEach，建议遍历数组使用该函数。

const a=["a", "b", "c"];
for (let val of a) {
    console.log(val);
}
//依次打印结果 "a", "b", "c"

同时也对异步处理十分友好。

//延时
function delay(ms) {
  return new Promise((resolve)=> {
    setTimeout(resolve, ms);
  });
}

//异步函数打印数组内容
async function show(arr) {
  for (let item of arr) {
    await delay(400); //等待 forEach 则会无视 await
    console.log(item);
  }
}

show(["头", "条", "新", "浪", "潮"]);
//依次延时打印结果 "头"  "条"  "新"  "浪"  "潮"

forEach (ES5)

处理同步代码（不需要等待），则可以使用forEach用于在循环期间完成的异步进程。

const a=["a", "b", "c"];
a.forEach((val)=> {
    console.log(val);
});
//依次打印结果 "a", "b", "c"

异步处理例子

组和对象一样都是引用数据类型，数组中的数据按照顺序排列，从0开始，把这个叫做索引，也叫做下标，把数组中的每个数据叫做元素，或者简称元 。

数组的新建方式有字面量创建和构造函数创建两种方法

字面量创建： var arr=[4,5,3,6,2,1]

构造函数创建： var arr1=new Array(4,5,3,6,2,1);

注：如果通过数组的构造函数创建数组，参数仅有1个，且这个参数是正整数，则表示新建一个具备该正整数长度的空数组，里面有这个长度的若干空元素 。

一、for循环方法遍历数组

var arr=["d","e","f","a"];
for(var i=0;i<arr.length;i++){
    console.log(arr[i]);
 }

二、for...in循环遍历

var arr=["d","e","f","a"];
for (var i in arr){
      console.log(arr[i]);
 }

使用for循环与for...in循环遍历数组区别

1、当使用for in遍历时，会将所有属性包括下标都会转为字符型

2、for in不会遍历空元素，for会遍历空元素

3、for in可以遍历到数组的属性，for只能遍历数组所有下标，不能遍历属性

可以使用for...in的特性实现数组的不遍历空元素方法

for(var i=0;i<arr.length;i++){
          if(i in arr)console.log(arr[i]);
 } 

三、forEach方法（不会遍历空元素）

格式：arr.forEach(function(元素，下标，数组) {} )

var arr=[1,2,3,4,5,,7,8,9];
arr.forEach(function(item,index,arr){
      console.log(item);
})

四、map方法

格式： arr.map(function(元素，下标，数组) {} )

var arr=[1,2,3,4,5,,7,8,9];
arr.map(function(item,index,arr){
      console.log(item);
})

forEach与map方法区别

1、 forEach方法不会遍历空元素

2、forEach方法没有返回值

3、map返回值默认是一个与arr同等长度的数组，且数组内元素都是Undefined.结果演示如下：

var arr=[1,2,3,4,5,,7,8,9];
var arr1=arr.map(function(item,index,arr){
})
console.log(arr1);

运行结果