函数管道【JavaScript】

函数管道

什么是函数管道？

将多个单参函数组合起来，形成一个新的函数，前一个函数的输出是后一个函数的输入。

用一个例子来介绍函数管道的使用：将一个字符串变成小驼峰命名

        // 将字符串中每一个单词首字母大写
        function everyLetterUp(str) {
            return str.replace(/\b(\w)(\w+)\b/g, function ($1, $2, $3) {
                return $2.toUpperCase() + $3
            })
        }

        // 将字符串中除了首字符以外的其他字母小写
        function otherLetterLower(str) {
            return str.replace(/\b(\w)(\w+)\b/g, function ($1, $2, $3) {
                return $2 + $3.toLowerCase()
            })
        }

        // 去掉字符串中所有的空白字符
        function removeEmpty(str) {
            return str.replace(/\s+/g, "")
        }

        // 把第一个单词首字母变小写
        function firstLetterLower(str) {
            return str.replace(/\w/, function ($) {
                return $.toLowerCase()
            })
        }

当然我们可以分别调用函数依次得到结果，但是这样写的话代码过于冗杂，不利于后期维护和复用， 如果我们不改变源码，如何把这些函数结合到一起，形成一个新的函数，直接传递字符串就可以得到结果？那我们就可以使用函数管道。

函数管道实现

this.myPlugin.pipe = function () {
    let args = Array.from(arguments)
    return function (val) {
        for (let index = 0; index < args.length; index++) {
            // 拿到每一个函数
            let func = args[index]
            val = func(val)
        }
        return val
    }
}

这样的话就可以直接使用函数管道得到一个新的函数，就可以直接调用新的函数实现小驼峰命名。

        let smallCamel = myPlugin.pipe(everyLetterUp, firstLetterLower, otherLetterLower, removeEmpty)
        let result = smallCamel(str)

函数管道和柯里化结合使用

如果我们要在原来的基础上新增截取一段字符串的功能，但是这个函数需要传递两个参数，这时就可以结合柯里化来处理：

        // 截取字符串
        function curString(number, str) {
            return str.substring(0, number)
        }

柯里化的实现前文已经实现过

        let smallCamel = myPlugin.pipe(everyLetterUp, firstLetterLower, otherLetterLower, removeEmpty, myPlugin.Currying(curString, 5))
        let result = smallCamel(str)