我想更好地理解 es6 箭头函数。
给出以下示例:
export default function applyMiddleware(...middlewares) {
return (createStore) => (reducer, preloadedState, enhancer) => {
// snip actual enhancer logic
return {
...store,
dispatch
}
}
}
用文字描述以上内容:
- 我们导出的函数(applyMiddleware)采用带有扩展的数组参数。
- 然后 applyMiddleware 返回一个带有 createStore 参数的无名函数,这次返回另一个带有三个参数的无名函数。
所以如果没有箭头,它看起来像这样:
export default function applyMiddleware(...middlewares) {
return function(createStore){
return function(reducer,preloadedState,enhancer){
//some logic
return{...store,dispatch}
}
}
}
我的问题:
- 我对么?
- 我们在这里看到的常见用例/代码范例是什么?
你的第一个问题的答案或多或少(请参阅我的评论)。第二个问题的答案是,您看到的模式是使用closure https://stackoverflow.com/questions/111102/how-do-javascript-closures-work?rq=1 and currying https://medium.com/@kbrainwave/currying-in-javascript-ce6da2d324fe#.w34c54qew。导出函数的原始参数被收集到一个名为“中间件”的数组中,返回的函数关闭该数组(即可以访问)。然后可以使用另一个参数“createStore”再次调用该函数,然后返回另一个可以接受更多参数的函数。这允许一个人部分适用参数。对于一个更简单(也许更容易理解)的示例,让我们使用一个名为“add”的函数来添加两个数字:
let add = (x, y) => x + y;
不是很有趣。但让我们将其分解,以便它可以获取第一个数字并返回一个获取第二个数字的函数:
let add = x => y => x + y;
let add3 = add(3);
let seven = add3(4); // 7
对于我们的 add 函数来说,这似乎不是一个巨大的胜利,但您从一个更合理的现实示例开始。此外,与手动柯里化不同,可以(并且可取)使用柯里化函数来为您执行此操作,许多流行的库(lodash、underscore、ramda)都为您实现柯里化。使用 Ramda 的示例:
let add = R.curry((x, y) => x + y);
let add3 = add(3);
let five = add3(2);
let also5 = add(3, 2);
let still5 = add(3)(2); // all are equivalent.
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)