ES6 箭头函数链式调用

最新推荐文章于 2025-05-29 16:57:59 发布

原创最新推荐文章于 2025-05-29 16:57:59 发布 · 3.4k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #es6

es6 专栏收录该内容

31 篇文章

订阅专栏

本文介绍了一种使用箭头函数实现的管道函数，并通过reduce方法进行链式调用来简化复杂的函数组合流程。同时展示了reduce在数组求和中的应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这里列出来一个简单的例子，使用箭头函数的链式调用，形成管道函数形式。

let pipeline = (...funs) => val => funs.reduce((a, b) => b(a), val);
let plus = a => a + 1;
let mult = a => a * 2;
let addThenMult = pipeline(plus, mult);
console.log(addThenMult(5));

关于 reduce() 遍历数组，返回一个操作(比如相加)后的值，而非数组，常用于数组的求合。

比如：
[1,2,3,4,5,6].reduce(function(initNum, val){return initNum + val})
// 结果： 21

上面代码等同于下面的代码：

let plus = a => a + 1;
let mult = a => a * 2;
console.log(mult(plus(5)));

编译成 ES5 后的代码如下：

var pipeline = function pipeline() {
    for (var _len = arguments.length, funs = Array(_len), _key = 0; _key < _len; _key++) {
        funs[_key] = arguments[_key];
    }

    return function (val) {
        return funs.reduce(function (a, b) {
            return b(a);
        }, val);
    };
};
var plus = function plus(a) {
    return a + 1;
};
var mult = function mult(a) {
    return a * 2;
};
var addThenMult = pipeline(plus, mult);
console.log(addThenMult(5));