1、前言

数组方法有太多了，本文记录一些本人容易记错的一些数组方法，用于巩固及复习。
后续会慢慢的将其他数组方法添加进来。
善用数组方法可以使数据处理变的优雅且简单。

那下面让我们开始吧:

2、filter()

描述：

filter() 方法创建一个新数组，并将符合条件的所有元素添加到创建的新数组中。

语法：

Array.filter(callback(element, index, array) { // 函数体 }, thisValue)

参数：

callback与thisValue:

callback的参数列表:

thisValue的参数:

执行 callback 时，用于 this 的值。

返回值：

是一个由 filter() 参数一函数的返回值组成的新数组

示例：

let users = [
  {id: 11, name: "孙悟空"},
  {id: 21, name: "猪八戒"},
  {id: 31, name: "沙和尚"}
];

// 返回前两个用户的数组
let filterUsers = users.filter(item => item.id < 31);

console.log(filterUsers.length); // 2

3、map()

描述：

map() 方法创建一个新数组，新数组的每个元素是调用一次给定函数的返回值。

语法：

Array.map(callback(currentValue, index, array) { // 函数体 }, thisValue)

参数：

callback与thisValue

callback的参数列表:

thisValue的参数:

执行 callback 时，用于 this 的值。

返回值：

是一个由原数组每个元素执行回调函数的结果组成的新数组。

示例：

let number = [1, 2, 3].map(item => item + 1);

console.log(lengths); // 2, 3, 4

4、sort()

描述：

map() 方法在原数组上进行修改更改元素的顺序

注：默认排序顺序是在将元素转换为字符串，然后比较它们的UTF-16代码单元值序列时

语法：

Array.sort( compareFunction )

参数：

compareFunction

compareFunction的参数列表:

compareFunction返回值

返回一个说明这两个值顺序的数字

• 若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
• 若 a 等于 b，则返回 0。
• 若 a 大于 b，则返回一个大于 0 的值。
  

返回值：

返回值为排序后的数组，但是返回值通常会被忽略，因为修改了原数组。

示例：

let number = [1, 2, 3].map(item => item + 1);

console.log(lengths); // 2, 3, 4

5、reduce()

描述：
reduce() 方法为数组中的每一个元素依次执行(升序执行)回调函数，不包括数组中被删除或从未被赋值的元素。将其结果计算为一个值。

注：reduce() 可以作为一个高阶函数，用于函数的 compose。

语法：

Array.reduce(callback(accumulator, currentValue, index, array), initialValue)

参数：

callback与initialValue

callback的参数列表:

initialValue的参数:

作为第一次调用 callback函数时的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素作为初始值。 在没有初始值的空数组上调用 reduce 将报错。

返回值：

函数累计处理后的结果
执行完所有callback函数的accumulator参数

注:    我们的 reducer 函数的返回值分配给累计器，该返回值在数组的每个迭代中被记住，并最后成为最终的单个结果值。

示例：

let number = [1, 2, 3, 4];

let result = number.reduce((sum, current) => sum + current, 0);

console.log(result); // 10

6、forEach()

描述：

reduce() 方法为数组中的每一个元素依次执行(升序执行)回调函数，不包括数组中被删除或从未被赋值的元素。将其结果计算为一个值。

注：reduce() 可以作为一个高阶函数，用于函数的 compose。

语法：

Array.forEach(callback(currentValue , index , array), thisValue)

参数：

callback与thisValue

callback的参数列表：

thisValue的参数：

执行 callback 时，用于 this 的值。

返回值：

该方法没有返回值。

示例：

let number = [1, 2, 3, 4];

number.forEach((item, index ,array) =>{
 console.log(item); // 1/2/3/4
});

7、方法列表

方法属性：

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

猜你喜欢

• chrome中监听cookie变化的方法操作是什么

  这篇文章主要介绍了chrome监听cookie变化与赋值问题,cookie监听与赋值操作需要manifest文件里声明权限问题，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下

• JS异步函数是怎样，函数异步调用如何返回

  如果调用者在函数返回时无法获得预期的结果，但在未来需要通过一定的手段获得，那么函数是异步的。如果函数异步，调用后立即返回，但不会立即返回预期结果。

• 基于VUE框架怎么做树形表格，过程及代码是什么

  这篇文章主要为大家详细介绍了vue+element UI实现树形表格，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

• node.js中事件循环怎么样写，有哪些知识点

  Node.js是单进程单线程应用程序，但是通过事件和回调支持并发，所以性能非常高。Node.js的每一个API都是异步的，并作为一个独立线程运行，使用异步函数调用，并处理并发。Node.js基本上所有的事件机制都是用设计模式中观察者模式实现。Node.js单线程类似进入一个while(true)的事件循环，直到没有事件观察者退出，每个异步事件都生成一个事件观察者，如果有事件发生就

• Angular的依赖注入模式是什么样的，有哪些应用

  本篇文章带大家深入了解Angular中的依赖注入模式，分享依赖注入模式的应用和玩法案例，希望对大家有所帮助！