此compose函数传递到Javascript减少的执行流程是什么？

如何解决此compose函数传递到Javascript减少的执行流程是什么？

我只想知道在以下代码的情况下reduce是如何工作的（这是我的上一个问题中的stackoverflow用户提供的，我问这个问题是因为他的代码段导致我遇到了更多不是已清除，而且时间太长，无法放入评论部分）。函数数组传递给化简器。有一个compose函数在函数数组上运行。据我了解，f是累加器，g是数组中的下一项。减少的每个循环返回的内容将成为下一个循环的累加器。如果没有将initalValue参数传递给reduce，则数组中的第一项将用作初始累加器值。

const compose = (f,g,i) => (...args) =>  {
  console.log(i,g);
  console.log(i,f);
  return f(g(...args));
}

const f_xe = (x) => x + 'e',f_xd = (x) => x + 'd',f_xc = (x) => x + 'c',f_xy = (x,y) => x + y;

console.log([f_xe,f_xd,f_xc,f_xy].reduce(compose)('a','b'));

// 3 [Function: f_xy]
// 3 [Function]
// 2 [Function: f_xc]
// 2 [Function]
// 1 [Function: f_xd]
// 1 [Function: f_xe]
// abcde

我像这样想象它：

cycle #1:
f = f_xe
g = f_xd
return f(g(...args))
^ which is f_xe(f_xd('a','b'))

cycle #2:
f = what was returned previously
^^ which will be f_xe(f_xd('a','b'))

g = f_xc

return f(g(...args))
^^ which is f_xe(f_xd('a','b'))(f_xc('a','b'))

我已经知道这种思路在流程以封装方式工作时是错误的，例如：f_xe(f_xd((f_xc(f_xy('a','b'))))) 但是为什么会这样呢。如果有人可以复杂地解释为什么用这种方法包装并逐步分解减少的每个循环，将不胜感激。我想知道的另一件事是，为什么不尝试在第一个周期立即进行评估？ f_xe(f_xd('a','b'))返回这段代码时，是否会尝试对此求值并产生错误，而不是继续进行数组中的下一项？相反，即使指示从头开始应用compose函数，代码也将从数组的最后一项开始评估。我确实知道使用组合功能时，最后一项将首先运行，然后依此类推，但是控制台日志语句不应该按照先后顺序运行吗？

再次，我知道我的思路完全与之相反，但是我希望是否能分享我的思路，有人可以将其推向正确的方向。谢谢任何能对此有所了解的人。

解决方法

首先忘记'a'和'b'参数。重要的部分是

const f = [f_xe,f_xd,f_xc,f_xy].reduce(compose);

这是我们需要研究的内容，我们可以在其中应用reduce的定义。 f('a','b')的呼叫稍后出现。

在展开reduce通话时，我们发现

const f = compose(compose(compose(f_xe,1),2),f_xy,3);

（实际上有点奇怪。我建议使用reduceRight来编写函数。还要将identify函数作为累加器的初始值。）

现在我们可以展开compose调用：

const f1 = (...args) => {
  console.log(1,f_xe);
  console.log(1,f_xd);
  return f_xe(f_xd(...args));
}
const f2 = (...args) => {
  console.log(2,f1);
  console.log(2,f_xc);
  return f1(f_xc(...args));
}
const f3 = (...args) => {
  console.log(3,f2);
  console.log(3,f_xy);
  return f2(f_xy(...args));
}
const f = f3;

现在，当您调用f3('a','b')时，您可以看到为什么日志“向后”发生。

是否应该以先到后的顺序运行控制台日志语句？

如果需要，最好将它们放在compose函数中，而不要放在返回的闭包中。尝试

const compose = (f,g,i) =>  {
  console.log(i,g);
  console.log(i,f);
  return  (...args) => f(g(...args));
}