ES 5 数组方法

• JavaScript入门学习笔记

1. forEach()

2. map()

3. filter()

4. every()

5. some()

6. reduce()

7. reduceRight()

8. indexOf()

9. lastIndexOf()

概述

1. 大多数方法的第一个参数接收一个函数。
   并且对数组的的每个元素（或一些元素）调用一次该函数（如果是稀疏数组，对不存在的元素不调用传递的函数）
2. 在大多数情况下，调用提供的函数使用三个参数：数组元素、元素的索引和数组本身。
   通常，只需要第一个参数值，可以忽略后两个参数。
3. 大多数方法第二个参数是可选的。
   如果有第二个参数，则调用的函数被看做是第二个参数的方法（也就是说，在调用函数时传递进去的第二个参数作为它的 this 关键字的值来使用）
4. 被调用的函数的返回值非常重要，但是不同的方法处理返回值的方式也不一样。
5. ES 5 中的数组方法都不会修改其调用的原始数组，但是传递给这些方法的函数是可以修改这些数组的。

方法	功能	返回值
forEach()	对数组的每个元素执行一次给定的函数	undefined
map()	创建一个新数组，其结果是该数组中的每个元素都调用一次提供的函数后的返回值	一个新数组
filter()	创建一个新数组, 其包含通过所提供函数实现的测试的所有元素
every()	测试一个数组内的所有元素是否都能通过某个指定函数的测试	一个布尔值
some()	测试数组中是不是至少有1个元素通过了被提供的函数测试
reduce()	对数组中的每个元素执行一个由您提供的reducer函数(升序执行)	函数累计处理的结果
reduceRight()	接受一个函数作为累加器（accumulator）和数组的每个值（从右到左）
indexOf()	返回指定元素在数组中的第一个的索引，如果不存在则返回 -1	索引或 -1
lastIndexOf()	返回指定元素在数组中的最后一个的索引，如果不存在则返回 -1

forEach()

功能

  对数组的每个元素执行一次给定的函数

语法

arr.forEach(callback(currentValue [, index [, array]])[, thisArg])

参数

• callback：为数组中每个元素执行的函数，接收 1~3 个参数
  • currentValue：数组中正在处理的当前元素
  • index（可选）：数组中正在处理的当前元素的索引
  • array（可选）：forEach() 方法正在操作的数组
• thisArg（可选）：如果 thisArg 参数有值，则每次执行回调函数 callback 时，this 都会指向 thisArg 参数。  如果省略了如果 thisArg 参数有值，则每次 callback 函数被调用时，this 都会指向 thisArg 参数。如果省略了 thisArg 参数，或者其值为 null 或 undefined，this 则指向全局对象。

返回值

  undefined

描述

  forEach() 方法按升序为数组中含有效值的每一项执行一次 callback 函数，那些已删除或者未初始化的项将被跳过（例如在稀疏数组上）

  forEach() 遍历的范围在第一次调用 callback 前就会确定，也就是说：

1. 调用 forEac() 后添加到数组中的项不会被 callback 访问到
2. 如果已经存在的值被改变，则传递给 callback 的值 是forEach() 遍历到他们那一刻的值
3. 已删除的项不会被遍历到
4. 如果已访问的元素在迭代时被删除了（例如使用 shift() ），之后的元素将被跳过

注意

  forEach() 无法在所有元素都传递给调用的函数之前终止遍历。如果要提前终止，必须把 forEach() 方法放在一个 try 块中，并能抛出一个异常。当然，还可以使用其它循环或方法，或者也可以使用 filter() 提前过滤出需要遍历的部分，再用 forEach() 处理（只要条件允许）。

示例

—求和与求积

var data = [1, 2, 3, 4, 5];

var sum = 0;
data.forEach(function(value){ sum += value; });
console.log(sum);

var product = 1;
data.forEach(function(value){ product *= value; });
console.log(product);

map()

功能

  创建一个新数组，其结果是该数组中的每个元素都调用一次提供的函数后的返回值

语法

var new_array = arr.map(function callback(currentValue[, index[, array]]) {
// Return element for new_array
}[, thisArg])

返回值

  回调函数的结果组成新数组的每一个元素

描述

  callback 每次执行后的返回值（包括 undefined）组合起来形成一个新数组。 callback 函数只会在有值的索引上被调用；那些从来没被赋过值或者使用 delete 删除的索引则不会被调用

  map() 方法处理数组元素的范围在 callback 方法第一次调用之前就已经确定了

  根据规范中定义的算法，如果被map调用的数组是离散的，新数组将也是离散的保持相同的索引为空

注意

  map() 生成一个新数组，当你不打算使用返回的新数组却使用 map() 是违背设计初衷的，请用 forEach() 或者 for-of 替代。

示例

—求平方根

var numbers = [1, 4, 9];
var roots = numbers.map(Math.sqrt);
// roots的值为[1, 2, 3], numbers的值仍为[1, 4, 9]

filter()

功能

  创建一个新数组, 其包含通过所提供函数实现的测试的所有元素

语法

var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])

返回值

  一个新的、由通过测试的元素组成的数组，如果没有任何数组元素通过测试，则返回空数组

描述

  filter 为数组中的每个元素调用一次 callback 函数，并利用所有使得 callback 返回 true 或等价于 true 的值的元素创建一个新数组

示例

—筛选排除所有较小的值

function isBigEnough(element) {
  return element >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44] 

every()

功能

  测试一个数组内的所有元素是否都能通过某个指定函数的测试，返回一个布尔值

语法

arr.every(callback[, thisArg])

返回值

  如果回调函数的每一次返回都为 truthy 值（真值），返回 true ；否则返回 false

描述

  every 方法为数组中的每个元素执行一次 callback 函数，直到它找到一个会使 callback 返回 falsy 的元素。如果发现了一个这样的元素，every 方法将会立即返回 false

注意

  若收到一个空数组，此方法在一切情况下都会返回 true

示例

—检测所有数组元素的大小

function isBigEnough(element, index, array) {
  return element >= 10;
}
[12, 5, 8, 130, 44].every(isBigEnough);   // false
[12, 54, 18, 130, 44].every(isBigEnough); // true

some()

功能

  测试数组中是不是至少有1个元素通过了被提供的函数测试，返回一个布尔值

语法

arr.some(callback(element[, index[, array]])[, thisArg])

返回值

  数组中有至少一个元素通过回调函数的测试就会返回true；所有元素都没有通过回调函数的测试返回值才会为false

描述

  some() 为数组中的每一个元素执行一次 callback 函数，直到找到一个使得 callback 返回一个“真值”（即可转换为布尔值 true 的值）。如果找到了这样一个值，some() 将会立即返回 true

示例

—测试数组元素的值

function isBiggerThan10(element, index, array) {
  return element > 10;
}

[2, 5, 8, 1, 4].some(isBiggerThan10);  // false
[12, 5, 8, 1, 4].some(isBiggerThan10); // true

reduce()

功能

  对数组中的每个元素执行一个由您提供的reducer函数(升序执行)，将其结果汇总为单个返回值

语法

arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])

参数

• callback：执行数组中每个值 (如果没有提供 initialValue则第一个值除外)的函数，包含四个参数：
  • accumulator：累计器累计回调的返回值；如果调用reduce()时提供了initialValue，accumulator取值为initialValue，如果没有提供 initialValue，那么accumulator取数组中的第一个值
  • currentValue：数组中正在处理的当前元素
  • index（可选）：数组中正在处理的当前元素的索引。 如果提供了initialValue，则起始索引号为0，否则从索引1起始
  • array（可选）：reduce() 方法正在操作的数组
• initialValue（可选）：作为第一次调用 callback函数时的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素。 在没有初始值的空数组上调用 reduce 将报错

返回值

  函数累计处理的结果

示例

—求和

var sum = [0, 1, 2, 3].reduce(function (accumulator, currentValue) {
  return accumulator + currentValue;
}, 0);
// 和为 6

—将二维数组转化为一维（扁平化）

var flattened = [[0, 1], [2, 3], [4, 5]].reduce(
  function(a, b) {
    return a.concat(b);
  },
  []
);
// flattened is [0, 1, 2, 3, 4, 5]

—数组去重

var myArray = ['a', 'b', 'a', 'b', 'c', 'e', 'e', 'c', 'd', 'd', 'd', 'd'];
var myOrderedArray = myArray.reduce(function (accumulator, currentValue) {
  if (accumulator.indexOf(currentValue) === -1) {
    accumulator.push(currentValue);
  }
  return accumulator
}, [])

console.log(myOrderedArray);

reduceRight()

功能

  接受一个函数作为累加器（accumulator）和数组的每个值（从右到左）将其减少为单个值

indexOf()

功能

  返回在数组中可以找到的一个给定元素的第一个索引，如果不存在，则返回 -1。

语法

arr.indexOf(searchElement[, fromIndex])

参数

• searchElement：要查找的元素
• fromIndex（可选）：开始查找的位置，默认值为0，可以为负值。
    如果该索引值大于或等于数组长度，意味着不会在数组里查找，返回-1。

返回值

  首个被找到的元素在数组中的索引位置; 若没有找到则返回 -1

描述

  indexOf 使用strict equality 进行判断 searchElement与数组中包含的元素之间的关系

示例

—找出指定元素出现的所有位置

var indices = [];
var array = ['a', 'b', 'a', 'c', 'a', 'd'];
var element = 'a';
var idx = array.indexOf(element);
while (idx != -1) {
  indices.push(idx);
  idx = array.indexOf(element, idx + 1);
}
console.log(indices);
// [0, 2, 4]

lastIndexOf()

功能

  返回指定元素在数组中的最后一个的索引，如果不存在则返回 -1。从数组的后面向前查找，从 fromIndex 处开始。

转载：MDN, Array.prototype.lastIndexOf()