JavaScript函数式编程之函数组合函数compose和pipe的实现

Cristalven 发布于2019-08-26 11:55 / 2381人阅读

摘要：函数组合是函数式编程中非常重要的思想，它的实现的思路也没有特别复杂。前者从左向右组合函数，后者方向相反。下面就是一个最简单的可以组合两个函数的在实际应用中，只能组合两个函数的组合函数显然不能满足要求，我们需要可以组合任意个函数的组合函数。

函数组合是函数式编程中非常重要的思想，它的实现的思路也没有特别复杂。有两种函数组合的方式，一种是pipe，另一种是compose。前者从左向右组合函数，后者方向相反。
下面就是一个最简单的可以组合两个函数的compose

let compose = (f, g) => (...args) => f(g(...args));

在实际应用中，只能组合两个函数的组合函数显然不能满足要求，我们需要可以组合任意个函数的组合函数。下面提供两种思路。

一种思路

两种方法一种是递归，一种是循环，其实都是一样的。具体的思路就是，先写一个组合可以两个函数的compose2，用compose2先把传进来的末尾的两个函数组合了，返回一个函数func，然后再compose2把func和传进来的下一个函数组合起来，以此类推。

循环的方法

let compose2 = (f, g) => (...args) => f(g(...args));
let compose = (...funcArgs) => (...args) => {
  let funced = funcArgs[funcArgs.length - 1];
  for (let i = funcArgs.length - 2; i >= 0; i--) {
    if (i === 0) {
      return compose2(funcArgs[i], funced)(...args);
    }
    funced = compose2(funcArgs[i], funced);
  }
}

// 与compose组合方向相反的函数组合函数
let pipe = (...funcArgs) => compose(...funcArgs.reverse());

递归的方法

let compose2 = (f, g) => (...args) => f(g(...args));
let compose = (...funcArgs) => (...args) => {
  let [...funcArgsCopy] = funcArgs;
  let callSelf = func => {
    if (funcArgsCopy.length === 0) return func;
    let funced = compose2(funcArgsCopy.pop(), func);
    return callSelf(funced);
  }
  return callSelf(funcArgsCopy.pop())(...args);
}

let pipe = (...funcArgs) => compose(...funcArgs.reverse());

更简单的思路

上面的思路还是有点麻烦，其实不用纠结在组合，直接把前一个函数的处理参数之后的返回值传给下一个函数就可以了。
循环的方法

let compose = (...funcArgs) => (...args) => {
  for (let i = funcArgs.length - 1; i >= 0; i--) {
    args = i === funcArgs.length - 1 ? funcArgs[i](...args) : funcArgs[i](args);
  }
  return args;
}

let pipe = (...funcArgs) => compose(...funcArgs.reverse());

递归的方法

let compose = (...funcArgs) => (...args) => {
  let [...funcArgsCopy] = funcArgs;
  let funced = (...func) => {
    if (funcArgsCopy.length === 0) return func[0];
    func = funcArgsCopy.pop()(...func);
    return funced(func);
  }
  return funced(...args);
}

let pipe = (...funcArgs) => compose(...funcArgs.reverse());

我在github https://github.com/zhuanyongx...

云服务器 GPU云服务器 javascript函数式编程函数式编程函数式编程指针函数式编程语言?

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/107842.html

翻译连载 | JavaScript轻量级函数式编程-第4章:组合函数 |《你不知道的JS》姊妹篇

摘要：把数据的流向想象成糖果工厂的一条传送带，每一次操作其实都是冷却切割包装糖果中的一步。在该章节中，我们将会用糖果工厂的类比来解释什么是组合。糖果工厂靠这套流程运营的很成功，但是和所有的商业公司一样，管理者们需要不停的寻找增长点。原文地址：Functional-Light-JS 原文作者：Kyle Simpson－《You-Dont-Know-JS》作者关于译者：这是一个流淌...

JowayYoung 2019-08-20 19:08 评论0 收藏0
JavaScript函数式编程，真香之组合(一)

摘要：组合的概念是非常直观的，并不是函数式编程独有的，在我们生活中或者前端开发中处处可见。其实我们函数式编程里面的组合也是类似，函数组合就是一种将已被分解的简单任务组织成复杂的整体过程。在函数式编程的世界中，有这样一种很流行的编程风格。 JavaScript函数式编程，真香之认识函数式编程(一) 该系列文章不是针对前端新手，需要有一定的编程经验，而且了解 JavaScript 里面作用域，闭...

mengbo 2019-08-23 15:22 评论0 收藏0
JavaScript函数式编程之错误处理，强壮代码

摘要：可当我们进行函数式编程时，这样的方式会遇到困难，难点在于如何停止。而在函数式编程中，数据在管道中流动，上一个函数的返回值会传给下一个函数，除非报错，事先写好的流程是停不下来的。以下代码会用到函数组合函数compose，只要知道compose是干什么的就足够了，如果好奇具体的实现，可以看《JavaScript函数式编程之函数组合函数compose和pipe的实现》在写命令式的代码时，...

Yi_Zhi_Yu 2019-08-22 16:15 评论0 收藏0
函数式编程 - 组合compose

摘要：函数式编程中有一个比较重要的概念就是函数组合组合多个函数，同时返回一个新的函数。深入理解认识函数式编程里面跟类似的方法，就是。主要作用也是组合多个函数，称之为流，肯定得按照正常方法，从左往右调用函数，与调用方法相反。函数式编程中有一个比较重要的概念就是函数组合（compose）,组合多个函数，同时返回一个新的函数。调用时，组合函数按顺序从右向左执行。右边函数调用后，返回的结果，作为左...

zhangrxiang 2019-08-23 15:34 评论0 收藏0
JavaScript函数式编程之管道分支，消除if/else的一种方式

摘要：在函数式编程中的错误处理，强壮代码文章中所用的思路与本篇一样，只不过在函数式编程中的错误处理，强壮代码中可以认为是以和作为标识，而本篇单独创造了标识。使用本篇的方法重写函数式编程中的错误处理，强壮代码中的代码参考资料函数式编程指南我在以下代码会用到函数组合函数compose，只要知道compose是干什么的就足够了，如果好奇具体的实现，可以看《JavaScript函数式编程之函数组合...

IntMain 2019-08-22 16:21 评论0 收藏0