文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

从数组Reduce中构建Map等12个函数的方法教程

2024-04-02 19:55

关注

这篇文章主要介绍“从数组Reduce中构建Map等12个函数的方法教程”,在日常操作中,相信很多人在从数组Reduce中构建Map等12个函数的方法教程问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”从数组Reduce中构建Map等12个函数的方法教程”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

从数组Reduce中构建Map等12个函数的方法教程

一、万物之始 array.reduce 的应用

Reduce的核心在于降维,将数组reduce为一个值,比如求和:

const arr = [52, 71, 27, 38]; const sum = (x, y) => x + y; const cusSum = arr.reduce(sum, 0);

将reduce作为思考工具,脑子中要始终留有 initial-value 初始值。

二、构建 array.map 从数学到编程

map是数学思维而直接入编程,从reduce中模拟构建为:

const cusMap = (arr, fn)                => arr.reduce((x, y)                => x.concat(fn(y)), []);

三、构建 array.flat array.flatMap 拍平数组

从array.flat我们窥探到 declaratively 编程的优势,只须将精力专注到要完成的任务上,而不必理会实现细节。用 reduce  实现为:

当只 flat 到一层深度时候:

# flat only to one level  const flat1 = arr => [].concat(...arr); const flat2 = arr = arr.reduce(acc, v => acc.concat(v), [])

当需要 flat 到任意深度时, 用 reduce 完全重构 flat:

if (!Array.prototype.flat) {   Array.prototype.flat = function(n = 1) {     this.flatAllX = () =>       this.reduce(         (f, v) => f.concat(Array.isArray(v) ? v.flat(Infinity) : v),         []       );      this.flatOneX = () => this.reduce((f, v) => f.concat(v), []);          return n === Infinity       ? this.flatAllX()       : n === 1       ? this.flatOneX()       : this.flatOneX().flat(n - 1);   }; }

 四、array.filter 迈向高阶的逻辑判断 logic predicate

为什么要用 reduce 重新构建,因为能够帮助在头脑中始终擦亮 function 与 最终输出 acculator 的概念。

const cusFilter = (arr, fn)                 =>  arr.reduce((acc, val)                 => (fn(val) ? acc.concat(y)                         : acc), []);

 五、array.find 与 array.findIndex 只找出首个元素

array.filter将会筛选出来全部的符合要求的元素,当我们只要单个元素的时候则应用 array.find.

const cusFind = arr.reduce((acc, val)    => (acc === undefined && fn(val) ? val        : acc), undefined);

重新构建 array.findIndex:

const cusFindIndex = arr.reduce((x, y, i)                      => (x == -1 && fn(y) ? i                           : x), -1);

进而,我们用 find 与 findIndex 简单的构建 includes 与 indexOf。

arr.includes(value); // arr.find(v => v === value) arr.indexOf(value);  // arr.findIndex(v => v === value)

 六、快捷的 array.some 与 array.every

array 与 some 两函数虽然简单,思考和使用的时候尤其顺手。

// arr.every(fn); arr.reduce((a, v) => a && fn(v), true); // a for accumulator,  // arr.some(fn); arr.reduce((a, v) => a|| fn(v), false); // v for value

到此,关于“从数组Reduce中构建Map等12个函数的方法教程”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注编程网网站,小编会继续努力为大家带来更多实用的文章!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯