函数式实现JS中Array的方法

最近工作的事情太多,好几个项目交替在一起,导致这一块的精更没有顺利的进行下去,今天抽空进行下去。对于数组的方法通过函数式来实现:在这里我将一步一步的把这篇文章更新完成。



Array的forEach方法函数式的实现。

首先我们进行定义:


aforEach

在对数组的forEach进行模拟,我们可以清晰的知道,这就是一个简单的数组循环,没有任何觉得高端的地方。正是这样的。他没有任何关于外界交互。他就是纯粹在自我的世界里。输入什么就会得到制定的输出。

下面开看他的测试(以图例说明):


测试例子

看例子就知道了。结果就不用在这里贴出来了。接下来我们思考如果实现map。



Array的map方法函数式的实现

别的不说我们先上定义好的代码,然后进行一步一步的分析


map

在代码层面上,只是使用const定义一个map变量,来接收一个函数。与froEach不同的是,map返回值是一个数组对象。如何实现这个功能呢?当然是在纯粹的地方干着纯粹的事情。在方法中定义一个空数组rerule来存储我们需要最后返回的对象,这样就能实现map的纯粹返回对象的功能了。

接下来我们看其测试用例:


map用例

不难发现,跟使用array的map方法一摸一样。



Array的filter方法的函数式实现

实现过map的方法之后,我们发现map是返回依赖原始数组的每一项组成的新对象数组的返回值。但是无法过滤不需要的状态。恰好filter实现完美实现这一块的需求的。

继续看他的定义:


filter

对比map的代码发现,只有再循环中的判断不同, (fn(array[i], i)) ? rerult.push(array[i]) : undefined; 仔细看这么代码我们很简单的就回发现,在回调函数中不满足条件的会返回undefined,满足条件的会被原样返回。

接下来看测试用例


filter用例

这里大家会发现,跟使用array的filter方法一样,简单有好用。还可以深入其底层实现。



Array的concat方法的函数式实现

在很多时候我们需要把数组对象中的某一个属性为array的所有项合并到一个单独的数组中进行管理,我应该如何做呢?

来我们先上代码:


concat

接下来我们直接更上我们的测试代码:


concat用例

接着更上运行结果:


结果

今天就更新到这里,也没有对里面的代码做一步一步的分析,找个时间会补上。

欢迎大家关注我。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容