数组的 map, filter ,sort和 reduce 用法

此处也是经过网上的一个题目例子来对数组的这几种用法进行分析整理的,能够在浏览器的控制台中打印结果进行对比。此处给出两组数组

  • 第一组(包含名、姓、出生日期以及死亡日期)
const inventors = [
    { first: 'Albert', last: 'Einstein', year: 1879, passed: 1955 },
    { first: 'wawa', last: 'fs', year: 1830, passed: 1905 },
    { first: 'grvd', last: 'xcvxcv', year:1900, passed: 1977 },
    { first: 'Hanna', last: 'Hammarström', year: 1829, passed: 1909 }
];
复制代码
  • 第二组(people数组,包含一组人名,名姓之间用逗号分隔。)
['Albert, Einstein', 'wawa, fs', 'grvd, xcvxcv', 'Hanna, Hammarström']
复制代码
根据这两组数组,完成如下的题目
  • 筛选出生于16世纪的发明家;
  • 以数组形式,列出其名与姓;
  • 根据其出生日期,并从大到小排序;
  • 计算全部的发明家加起来一共活了几岁;
  • 按照其年龄大小排序;

filter()(过滤操做,筛选符合条件的全部元素,若为true则返回组成新数组,以第一题为例:)

function bornyear(inventor) {
      return inventor.year >= 1800 && inventor.year < 1900;
    }
    var fifteen = inventors.filter(bornyear);
    console.log(fifteen);
    // 可简化为
    const fifteen = inventors.filter(inventor => (inventor.year >= 1500 && inventor.year < 1600));
复制代码

首先经过一个函数bornyear,在函数中进行条件的筛选,筛选出生日期在19世纪的发明家,返回的是true或者false。以后经过调用filter方法,将数组inventors里面的元素进行是否符合函数bornyear的筛选条件进行过滤。最后返回的是符合条件的一个结果数组以下。javascript

[
{first: "Albert", last: "Einstein", year: 1879, passed: 1955},
{first: "wawa", last: "fs", year: 1830, passed: 1905},
{first: "Hanna", last: "Hammarström", year: 1829, passed: 1909}
]
复制代码

map(映射操做,对原数组每一个元素进行处理,并回传新的数组。以第二题为例)

const fullnames = inventors.map(inventor => `${inventor.first} ${inventor.last}`);
 console.log(fullnames);
复制代码

打印出来的结果为:java

["Albert Einstein", "wawa fs", "grvd xcvxcv", "Hanna Hammarström"]
// inventors.map后面经过传入原操做数组,而后再进行字符串拼接的处理。最终返回的数组是一个通过处理以后的新数组
复制代码

sort(排序操做,默认排序顺序是根据字符串Unicode码点,如10在2以前,而数字又在大写字母以前, 大写字母在小写字母以前。也可以使用比较函数,数组会按照调用该函数的返回值排序,格式以下)

function compare(a, b) {
    if (a < b) {
    // 按某种排序标准进行比较, a 小于 b
      return -1;
    }
    if (a > b) {
      return 1;
    }
    // 当a === b 时候
      return 0;
}

复制代码

要比较数字而非字符串,比较函数能够简单的以 a 减 b,以下的函数将会将数组升序排列:数组

function compareNumbers(a, b) {
    return a - b;
 }
复制代码

针对第三题,咱们就能够简单用加减比较浏览器

const birthdate = inventors.sort((inventora, inventorb) => (inventorb.year - inventora.year));
console.log(birthdate)
复制代码

打印出来的结果为:函数

[
{first: "grvd", last: "xcvxcv", year: 1900, passed: 1977},
{first: "Albert", last: "Einstein", year: 1879, passed: 1955},
{first: "wawa", last: "fs", year: 1830, passed: 1905},
{first: "Hanna", last: "Hammarström", year: 1829, passed: 1909}
]
复制代码

reduce()(归并操做,总共两个参数,第一个是函数,能够理解为累加器,遍历数组累加回传的返回值,第二个是初始数值。若是没有提供初始值,则将使用数组中的第一个元素。以第四题为例:)

const totalyears = inventors.reduce((total, inventor) => { return total + (inventor.passed - inventor.year); }, 0);
console.log(totalyears);
复制代码

能够将数组进行便利,按照筛选条件找出所要累加的值。返回的是累加的结果ui

相关文章
相关标签/搜索