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) 

このとまったく同じです（。しかしtemp変数なし）

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

コードは、引数でapplyMiddlewareを呼び出しているreduxThunk ; applyMiddlewareは、ファンクションを返します。次に、コードはcreateStore引数でその関数を呼び出しています。

ここでのlibsまたは類似していないとの単純な例です：

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

Answer 2

私はapplyMiddlewareの定義は

ようになりますので、別の関数を返す関数を呼び出す方法です

const applyMiddleware = (middleware) => { 
    return (store) => { 
      // some modification here 
      return somethinghere; 
    } 
} 

あなたが見る2つの引数は、最初に外側の関数に、次に返されます 関数。

同様に、connectは、引き数の最初のetが接続関数に返す関数と、それによって返された関数の2番目の引き数セットを返します。

コール

export default connect(mapStateToProps)(UserList) 

見事に説明

​​