Question

有人可以帮助我了解此事件处理程序的结构吗？为什么它们有两个箭头功能？

const callAll = (...fns) => (...args) => fns.forEach(fn => fn && fn(...args));

Answer 1

这是一个高阶函数-一个返回另一个函数的函数。在这种特殊情况下，您的函数在获得函数列表时会返回一个新函数，该函数依次将这些函数应用于其参数。这个高阶函数通常被称为compose或pipe，因为它就是这样做的-通过一系列函数来运行参数，就像Unix管道一样（您知道，像grep | sort | uniq ）

请注意，您的示例并非特别习惯，写一个更好的方法是

pipe = (...fns) => x => fns.reduce((x, f) => f(x), x)

可以像

一样使用

pipe = (...fns) => x => fns.reduce((x, f) => f(x), x)


upper = s => s.toUpperCase()
reverse = s  => [...s].reverse().join('')
bang = s => s + '!'

convert = pipe(reverse, upper, bang)

result = convert('hello')

console.log(result)

Answer 2

该函数接受 n 个函数，并返回一个函数，当使用 n 自变量调用时，将使用这些自变量调用提供的每个函数。

以下是扩展的代码：

// Accept functions
function callAll(...fns) {

  // Return a function that accepts arguments
  return function (...args) {

    // Which, when called, calls each function with
    // those arguments
    fns.forEach(function (fn) {
      return fn && fn(...args);
    });
  }
};

const addOne = (n) => console.log(n + 1);
const addTwo = (n) => console.log(n + 2);

const addAllTheThings = callAll(addOne, addTwo);
addAllTheThings(3);

为什么此事件处理程序具有两个箭头功能？

2 个答案: