Array方法汇总

1. Array.protoype.map()

说明：

array.map()方法用于创建一个新数组， array中的每个元素都会调用map中提供的函数一次。

let numbers  = [1, 3, 5, 6];
let newArr  = numbers.map(function(x) {
   return x * x
})
// new: [1, 9, 25, 36]  , 生成的新数组
// numbers:  [1, 3, 5, 6] ， 原数组保持不变
复制代码

语法

let new_array = arr.map( callback[ , thisArg ] )

参数

callback 传入的函数，用于新功能处理，使用了三个参数：

1. currentValue 第一个参数 元素值，指数组中传入函数的元素
2. index 第二个参数 下标，正在处理的当前元素在数组中的下标
3. array 第三个参数 数组，指使用map的数组，即arr，这个和forEach方法的三个参数类似

---

通常情况下map方法中callbac函数只需要接受第一个参数即可，但这并不意味着map只给callback传了一个参数。比如：

[1,2,3].map(parseInt)
// 返回[1,  NaN,  NaN]
// 这是因为parseInt方法本身就接受两个参数，第一个是字符串， 第二个是进制数， 平时不传默认就是10， 十进制。
// 避免不会出现这种错误的方法就是，自己写个只接受一个参数的函数
function returnInt(el) {
  return parseInt(el) // 采用默认的十进制， 也可以写parseInt(el, 10)
}
[1,2,3].map(returnInt)
// [1, 2, 3]
复制代码

2. Array.prototype.from(arr)

说明：

方法从一个类似数组或可迭代的对象中创建一个新的数组实例。 类数组转为真数组。 ie要edge以上才兼容，需要使用polyfill。

• 类数组： string字符串等，拥有一个 length 属性和若干索引属性的任意对象。
• 可遍历对象： 你可以从它身上迭代出若干个元素的对象，比如有map和set。

const bar = ["a", "b", "c"];
Array.from(bar);
// ["a", "b", "c"]

Array.from('foo');
// ["f", "o", "o"]
复制代码

语法

Array.from(arrayLike[, mapFn[, thisArg]])

参数

callback 传入的函数，用于新功能处理，使用了三个参数：

1. arrayLike 第一个参数 类数组
2. mapFn 第二个参数 函数，可以在最后生成的数组上再执行一次 map方法后再返回

Array.from([1, 2, 3], x => x + x);      
// [2, 4, 6]
复制代码

3. Array.prototype.forEach()

说明：

对数组的每个元素执行一遍forEach里的函数，该函数接收三个参数，和map一样。 map 和 forEach比较：

• 相同点：
  • 数组方法
  • 都是操作数组的每个元素，执行一段函数
• 不同点
  • map返回新数组，不会修改原数组。
  • forEach没有返回值，使用场景：就是需要数组的每个元素都去做一件事情