这一部分主要是熟悉 array 的几个基本方法，其中有两个（filter、map）是 es6 定义的迭代方法，这些迭代方法都有一个特点，就是对数组的每一项都运行给定函数，根据使用的迭代方法的不同，有不同的返回结果。
文档给出了一个初始操作的 <code>inventor</code> 数组，基于这个数组可以练习一下<code>array</code>的各个方法，请用<code>google chrome</code>浏览器打开 <code>html</code> 后在<code>console</code>面板中查看输出结果。
在 console 中我们常用到的可能是 <code>console.log()</code> ，但它还有一个很炫的输出，按照表格来输出，效果如下：
本节中我们将围绕如下数据进行相关操作以便快速掌握数组的相关方法的使用。
<a href="https://developer.mozilla.org/zh-cn/docs/web/javascript/reference/global_objects/array/filter">filter</a>
过滤操作，有点像 sql 里面的 select 语句。筛出运行结果是 true 的组成数组返回。
前面几篇已经提到过箭头函数，这里可以简化一下，用箭头函数来写，而且由于 if 语句的存在并不是必要的，可以写成下面这样：
控制台效果图：
<a href="https://developer.mozilla.org/zh-cn/docs/web/javascript/reference/global_objects/array/map">map</a>
map 形象的理解就是，把数组中的每个元素进行处理后，返回一个新的数组。
例子如下：
<a href="https://developer.mozilla.org/zh-cn/docs/web/javascript/reference/global_objects/array/sort">sort</a>
默认情况下，<code>array.prototype.sort()</code> 会将数组以字符串的形式进行升序排列（10 会排在 2 之前），但 sort 也可以接受一个函数作为参数。所以需要对数字大小排序时需要自己设定一个比较函数，例子如下：
上面的代码可以简写成：
<a href="https://developer.mozilla.org/zh-cn/docs/web/javascript/reference/global_objects/array/reduce">reduce</a>
由 <code>queryselectorall()</code> 获取到的是一个 <code>nodelist</code> ，它并非是 array 类型的数据，所以并不具有 map 和 filter 这样的方法，所以如果要进行筛选操作则需要把它转化成 array 类型，使用下面示例之中的 <code>array.from()</code> 来转化。
google chrome浏览球操作如下：
打开<code>https://book.douban.com/tag/web</code>网页。
在控制台按如下图操作即可
这是一个归并数组的方法，它接受一个函数作为参数（这个函数可以理解成累加器），它会遍历数组的所有项，然后构建一个最终的返回值，这个值就是这个累加器的第一个参数。第二个参数中的<code>0</code>是<code>previousvalue</code>的初始值，例子如下：
而此处我们需要统计一个给定数组中各个项的值，恰好可以用到这个方法，在累加器之中，将统计信息存入一个新的对象，最后返回统计值。
<a href="https://github.com/liyuechun/javascript30-liyuechun">github source code</a>
简介： 资深讲师，全栈工程师；区块链、高可用架构技术爱好者。
区块链技术交流qq群：348924182
「区块链部落」官方公众号