React/Redux 中的 Javascript 函数语法

Question

这甚至可能更像是一个通用的 Javascript(可能是 es6)问题，但在这里让我们看看它是如何发挥作用的。

我每天都会遇到这种类型的语法，并且开始变得恼火，因为我不明白这些东西在幕后是如何工作的:

const createStoreWithMiddleware = applyMiddleware(reduxThunk)(createStore)

我可以看到 applyMiddleware 显然是一个函数，在此示例中，它以 reduxThunk 作为参数。但是，我不知道 createStore 在旁边的括号中做了什么。

这个例子也一样，我对 UserList 的情况感到困惑:

export default connect(mapStateToProps)(UserList)

谁能给我解释一下这是怎么回事？对两者的解释将不胜感激，因为它们都有不同的用途，并且最终成为一个表达式。

Answer 1

这个:

const createStoreWithMiddleware = applyMiddleware(reduxThunk)(createStore)

与此完全相同:

const temp = applyMiddleware(reduxThunk);
const createStoreWithMiddleware = temp(createStore);

(但没有 temp 变量。)

代码正在调用 applyMiddleware 并带有参数 reduxThunk； applyMiddleware 返回一个函数。然后，代码使用 createStore 参数调用该函数。

这是一个没有库或类似库的简单示例:

function createAdder(valueToAdd) {
    return function(valueToAddTo) {
        return valueToAddTo + valueToAdd;
    };
}

// Doing it all at once
const result1 = createAdder(5)(10);
console.log(result1); // 15

// Doing it step by step
const addFiveTo = createAdder(5);
const result2 = addFiveTo(10);
console.log(result2); // 15