管道函数

管道函数简单的说就是执行一些函数，前一个函数的返回值作为下一个函数的参数以此类推，有些时候使用管道函数的思想可以帮我们简化代码。就像vue中的filter，其实就是利用管道函数的思想，使用管道符号‘|’分隔多个filter函数，前一个filter函数的返回值作为下一个filter函数的参数，最后所有filter函数执行完毕之后作为最终的过滤结果。

然后我也自己去尝试着写了一下管道函数的实现：

 function pipeFunc(...funcs) {
    return function (...args) {
        return funcs.reduce((red, func) => {    
            return Array.isArray(red) ? func(...red) : func(red); 
        }, args);
    }
 }


 function fn1 (a, b) {
    return a + b;
 }
 function fn2 (a) {
    return a * 2;
 }
 function fn3 (a) {
     return a * 3;
 }
 
 console.log( pipeFunc(fn1, fn2, fn3)(1, 2) ); // 18

通过js数组的reduce方法可以比较方便的实现管道函数，但是好像存在一个问题，就是当我们需要除了第一个函数可以传多个参数，之后的函数也可以传多个参数的时候就不太适合使用管道函数了

下面是使用es6的箭头函数简化之后的函数：

 const pipiFunc = (...funcs) => (...args) => Array.isArray(red) ? func(...red) : func(red); 

使用箭头函数还是很香的，一行就解决了函数的实现，不过使用箭头函数的话可读性就没有那么好了