腾讯云·社区
BFE.dev前端刷题11 - 什么是composition？实现一个pipe()方法
bfe.dev 是一个针对前端的刷题网站，像是前端的LeetCode。该系列文章是我在上面的刷题日记。
题目11
BFE.dev#11 什么是Composition?实现pipe()
分析
这是目标。
/**
* @param { Array<(arg: any) => any> } funcs
* @returns { (arg: any) => any }
*/
function pipe(funcs) {
// your code here
}我们需要把参数的function合并为一个，显然我们需要closure。
开始代码
根据上述要求，我们先返回一个接受一个参数的空function
function pipe(funcs) {
return function(arg) {
// TODO: 通过funcs和arg计算最终结果
}
}在计算结果的时候，funcs中的function都需要被调用并且修改同一个变量，我们声明一个result，然后一个for loop就可以搞定。
function pipe(funcs) {
return function(arg) {
let result = arg
for (let func of funcs) {
result = func.call(this, result)
}
return result
}
}注意没有用arrow function，以保留正确的this。
这个题目其实很简单。
用reduce
当发现了result和一个for循环的时候，很自然想到用reduce。
这个并不会对本质产生变化，只是一种更酷简洁的写法而已。我们试试。
function pipe(funcs) {
return function(arg) {
return funcs.reduce((result, func) => {
return func.call(this, result)
}, arg)
}
}通过，撒花！
这个题目很简单，有兴趣可以去 https://bfe.dev 自己试试。
希望能帮助到你，下次见！
原创声明，本文系作者授权云+社区发表，未经许可，不得转载。
如有侵权，请联系 yunjia_community@tencent.com 删除。
相关文章
扫码关注云+社区
领取腾讯云代金券
我来说两句