koa-compose简单实现及使用的妙处

这篇文章主要为大家介绍了koa-compose简单实现及使用的妙处详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

场景

今年的行情真的是非常的差,而且面试的时候卷的不行。前段时间,有个朋友去面了某大厂,竟然被问到了手写一个koa-compose。那咱们今天就简单的实现一个看看到底难不难。

面试官让你实现一个场景:有一件衣服单价50元,买了num件,总和打了8折,然后运费是12元,算出买这num件衣服加上运费算上折扣需要多少钱?

首先需要实现三个函数

const express = (total) => { return total + 12; }; const discount = (total) => { return total * 0.8; }; const TShirtNum = (num) => { return 50 * num; }; 

TShirtNum代表num件衣服需要的费用,discount表示打了8折之后的费用,express表示算上运费的费用。

现在要求实现一个compose函数,然后调用这个函数,并把上面三个函数传入compose函数中,最后计算出结果。比如

const sellTshirt = compose([TShirtNum, discount, express]); sellTshirt(100) 

sellTshirt(100)会计算出最后的结果。如果要计算出最后的结果,就需要将TShirtNum计算出的结果传给discount,然后discount计算出的结果传给express

此时我们可以使用reduce实现。MDN介绍reduce为:reduce()  方法对数组中的每个元素按序执行一个由您提供的 reducer 函数,每一次运行 reducer 会将先前元素的计算结果作为参数传入,最后将其结果汇总为单个返回值。

第一次执行回调函数时,不存在“上一次的计算结果”。如果需要回调函数从数组索引为 0 的元素开始执行,则需要传递初始值。否则,数组索引为 0 的元素将被作为初始值 initialValue,迭代器将从第二个元素开始执行(索引为 1 而不是 0)。

很显然compose需要返回一个函数

const compose = (funcArr) => (startNum) => funcArr.reduce((pre, cur) => cur(pre), startNum) 

一行代码解决。startNum表示我们需要购买的数量,当做reduce的初始值,然后将上一次计算的结果传给下一个函数,相当于是TShirtNum计算的结果传给discount, 也就是我们代码中实现的cur(pre)。最后即可计算出结果。redux源码就是这样实现的

以上就是koa-compose简单实现及使用的妙处的详细内容,更多请关注0133技术站其它相关文章!

赞(0) 打赏
未经允许不得转载:0133技术站首页 » JavaScript 教程