☁️第4期第2题：实现一个pipe函数

[LinDaiDai]

实现一个pipe函数

(题目来源：30-seconds-of-interviews)

如下所示，实现一个pipe函数：

const square = v => v * v
const double = v => v * 2
const addOne = v => v + 1
const res = pipe(square, double, addOne)
console.log(res(3)) // 19; addOne(double(square(3)))

首先看到这道题，pipe是可以接收任意个数的函数，并且返回的是一个新的函数res。

(1) pipe基本结构

那么我们可以得出pipe的基本结构是这样的：

const pipe = function (...fns) {
  return function (param) {}
}

它本身是一个函数，然后我们可以利用...fns获取到所有传入的函数参数square、double这些。

之后它会返回一个函数，且这个函数中是可以接收参数param的。

(2) 返回的函数

接下来的逻辑主要就是在于返回的函数上了，在这个返回的函数中，我们需要对param进行层层处理。

OK👌，这很容易就让人想到了...reduce...

我们可以对fns函数数组使用reduce，之后reduce的初始值为传入的参数param。

让我们一起来看看最终的代码：

const pipe = function (...fns) {
  return function (param) {
    return fns.reduce((pre, fn) => {
      return fn(pre)
    }, param)
  }
}

最终返回的是经过fns数组中所有函数处理过的值。

当然，我们也可以用简洁点的写法：

const pipe = (...fns) => param => fns.reduce((pre, fn) => fn(pre), param)

这样就得到了我们想要的pipe函数了：

const square = v => v * v
const double = v => v * 2
const addOne = v => v + 1
const pipe = (...fns) => param => fns.reduce((pre, fn) => fn(pre), param)
const res = pipe(square, double, addOne)
console.log(res(3)) // 19; addOne(double(square(3)))