js中Array map()与forEach()的用法及遍历对象数组的方法

一、Array map()与forEach()的用法

ECMA5中Array引进了新的方法forEach()和map(),其用法相似。主要作用是都可以遍历到数组的每一个元素并对数组的每个元素执行一次提供的函数,其参数也一致。但是它们之间还是有区别的。

  • forEach()方法:

array.forEach(function(currentValue, index, arr), thisValue)

参数说明:

currentValue: 必须,当前元素的值;

index:可选,当前元素的索引值;

arr:可选,当前元素所属的数组;

thisValue:可选,传递给函数的值一般用作 "this" 值。如果省略了 thisValue ,"this" 的值为 "window"。

js中Array map()与forEach()的用法及遍历对象数组的方法_第1张图片

  • map()方法:

array.map(function(currentValue,index,arr), thisValue)

 参数说明同forEach()方法。

js中Array map()与forEach()的用法及遍历对象数组的方法_第2张图片

比较:

  • 相同点:

1.可以循环遍历数组中的每一项;

2.回调函数的参数分别为item(当前每一项),index(索引值),arr(原数组),若不指定this则指向window;

3.对空数组均不进行检测。

  • 不同点:

1.forEach()方法对数组的每个元素执行一次提供的函数,改变原始数组总是返回undefined;没有return语句,直接写入操作逻辑。

2.map()方法返回一个新的数组,不改变原数组;function函数里会可以有return语句。

二、遍历对象数组的方法

需求:将给定对象数组里的对象属性赋值给另一个对象数组

  • 使用js原始的for循环:

js中Array map()与forEach()的用法及遍历对象数组的方法_第3张图片

  • 使用数组的forEach()方法:

js中Array map()与forEach()的用法及遍历对象数组的方法_第4张图片

  • 使用数组的map()方法:

js中Array map()与forEach()的用法及遍历对象数组的方法_第5张图片

你可能感兴趣的:(JavaScript)