百度360必应搜狗淘宝本站头条
当前位置:网站首页 > IT技术 > 正文

帮你精通JS:解析与盘点数组array的5类22种方法

wptr33 2025-03-14 21:29 15 浏览

JS是唯一几乎全面支持函数式编程的流行语言,而函数编程的起点是处理数组。因此,我们首先来盘点 array 数组的5类22种方法。

一、数组变形 Transform (函数范式的纯函数)

首先列出对数组变形操作的没有side-effects的函数。

1) reduce 2) map 3) flat 4) flatMap 5) fill 6) forEach。其中 forEach 非 pure-function, 但属于隐性迭代方法,故而分类在此。

// 1.reduce
let total = [ 0, 1, 2, 3 ].reduce( ( acc, cur ) => acc + cur,
                                  0);
// 2.map 
const maped = [4, 7, 9, 18].map(x => x * 2);

// 3.flat
let arr2 = [5, 2, 3].flat();

// 4.flatMap
[5, 8, 9, 6].flatMap(x => [[x * 2]]);
 
// 5.fill 非纯函数,但是因为常用于构建 range 用于迭代,因此分类到这里
Array(5).fill(0)

// 6.forEach 非纯函数,作为 map 处理有 side-effect 问题的替代方案。
['x', 'y', 'z'].forEach(el => console.log(el));


二、数组逻辑判断 logic predicates(函数范式的纯函数)

函数范式的六个methods之后,我们继续考察用于逻辑判断的高阶函数:

1) filter 2) find 3) findIndex 4) includes 5) indexOf 6) some 7) every 以及我们可以自己构建颇有帮助 range 与 not。

其中 include 是 find 应用于一个元素,而 indexOf 则是 findIndex 用于一个元素。

// 1.filter
[23, 76, 98, 101].filter( v => v > 30 && v < 100 76 98 2.find find 23 76 98 101.find> v > 30 && v < 100 76 3.findindex index 23 76 98 101.findindex> v > 30 && v < 100 1 4.includes find 23 76 98 101.includes77 false 5.indexof findindex index -1 23 76 98 101.indexof77 -1 6.some 23 76 98> v > 30 && v < 100 true 7.every 23 76 98> v > 30 && v < 100) //false


三、非函数式的数组变形(纯函数)

以上两组12个函数均为函数范式编程的纯函数。接下来考察,其他对数组变形的纯函数。(纯函数是指没有side-effect副作用的函数):

1) concat 2) join 3) slice 4) splice (非纯函数,将会修改原数组,放在此处只与slice对比,作为提醒)

// 1.concat 
['x', 'y', 'z'].concat([9, 8, 7]);

// 2.join
['x', 'y', 'z'].join(",");

// 3.slice
['x', 'y', 'z'].slice(1, 3);

// 4.splice放到第四组中,此处只为提醒与slice相对比。


四、操作数据结构 (非纯函数)

Array可以作为两种抽象结构数据的载体:分别为 stack 和 queue。

1) push 2) pop 3) shift 4) unshift 5)splice(splice属于特殊方法,因为更改了原数组,放在此处)

let arr = [23, 76, 98, 101];

// 1. push 元素添加到尾部
> arr.push(120)
5
> console.log(arr)
[ 23, 76, 98, 101, 120 ]

// 2.pop 以上 push 与 pop 组合构建 stack 数据结构。
> arr.pop()
120
> arr
[ 23, 76, 98, 101 ]

// 3.shift 从数组头部取出元素,与push组合构建 queue 数据结构
> arr.shift()
23
> arr
[ 76, 98, 101 ]

// 4. unshift 从数组头部添加元素
> arr.unshift(59, 145)
5
> arr
[ 59, 145, 76, 98, 101 ]

// 5.splice 为特殊的方法,用于拼接数组
> arr.splice(1, 2, 55, 66, 77, 88)
[ 145, 76 ]
> arr
[ 59, 55,  66, 77, 88, 98, 101 ]


五、数组排序 (非纯函数)

最后以无处而不在的排序收尾,无论是 sort 还是 reverse 都直接在原数组上修改,也就是 inplace 操作。

1) sort 2) reverse

// 1. sort 
[23, 76, 98, 101].sort((x,y) => x - y)

// 2.reverse
[23, 76, 98, 101].reverse()


六、思维导图总结

相关推荐

每天一个编程技巧!掌握这7个神技,代码效率飙升200%

“同事6点下班,你却为改BUG加班到凌晨?不是你不努力,而是没掌握‘偷懒’的艺术!本文揭秘谷歌工程师私藏的7个编程神技,每天1分钟,让你的代码从‘能用’变‘逆天’。文末附《Python高效代码模板》,...

Git重置到某个历史节点(Sourcetree工具)

前言Sourcetree回滚提交和重置当前分支到此次提交的区别?回滚提交是指将改动的代码提交到本地仓库,但未推送到远端仓库的时候。...

git工作区、暂存区、本地仓库、远程仓库的区别和联系

很多程序员天天写代码,提交代码,拉取代码,对git操作非常熟练,但是对git的原理并不甚了解,借助豆包AI,写个文章总结一下。Git的四个核心区域(工作区、暂存区、本地仓库、远程仓库)是版本控制的核...

解锁人生新剧本的密钥:学会让往事退场

开篇:敦煌莫高窟的千年启示在莫高窟321窟的《降魔变》壁画前,讲解员指着斑驳色彩说:"画师刻意保留了历代修补痕迹,因为真正的传承不是定格,而是流动。"就像我们的人生剧本,精彩章节永远...

Reset local repository branch to be just like remote repository HEAD

技术背景在使用Git进行版本控制时,有时会遇到本地分支与远程分支不一致的情况。可能是因为误操作、多人协作时远程分支被更新等原因。这时就需要将本地分支重置为与远程分支的...

Git恢复至之前版本(git恢复到pull之前的版本)

让程序回到提交前的样子:两种解决方法:回退(reset)、反做(revert)方法一:gitreset...

如何将文件重置或回退到特定版本(怎么让文件回到初始状态)

技术背景在使用Git进行版本控制时,经常会遇到需要将文件回退到特定版本的情况。可能是因为当前版本出现了错误,或者想要恢复到之前某个稳定的版本。Git提供了多种方式来实现这一需求。...

git如何正确回滚代码(git命令回滚代码)

方法一,删除远程分支再提交①首先两步保证当前工作区是干净的,并且和远程分支代码一致$gitcocurrentBranch$gitpullorigincurrentBranch$gi...

[git]撤销的相关命令:reset、revert、checkout

基本概念如果不清晰上面的四个概念,请查看廖老师的git教程这里我多说几句:最开始我使用git的时候,我并不明白我为什么写完代码要用git的一些列指令把我的修改存起来。后来用多了,也就明白了为什么。gi...

利用shell脚本将Mysql错误日志保存到数据库中

说明:利用shell脚本将MYSQL的错误日志提取并保存到数据库中步骤:1)创建数据库,创建表CreatedatabaseMysqlCenter;UseMysqlCenter;CREATET...

MySQL 9.3 引入增强的JavaScript支持

MySQL,这一广泛采用的开源关系型数据库管理系统(RDBMS),发布了其9.x系列的第三个更新版本——9.3版,带来了多项新功能。...

python 连接 mysql 数据库(python连接MySQL数据库案例)

用PyMySQL包来连接Python和MySQL。在使用前需要先通过pip来安装PyMySQL包:在windows系统中打开cmd,输入pipinstallPyMySQL ...

mysql导入导出命令(mysql 导入命令)

mysql导入导出命令mysqldump命令的输入是在bin目录下.1.导出整个数据库  mysqldump-u用户名-p数据库名>导出的文件名  mysqldump-uw...

MySQL-SQL介绍(mysql sqlyog)

介绍结构化查询语言是高级的非过程化编程语言,允许用户在高层数据结构上工作。它不要求用户指定对数据的存放方法,也不需要用户了解具体的数据存放方式,所以具有完全不同底层结构的不同数据库系统,可以使用相同...

MySQL 误删除数据恢复全攻略:基于 Binlog 的实战指南

在MySQL的世界里,二进制日志(Binlog)就是我们的"时光机"。它默默记录着数据库的每一个重要变更,就像一位忠实的史官,为我们在数据灾难中提供最后的救命稻草。本文将带您深入掌握如...