54606


はじめて、質問を投稿させていただきます。  
4月から新卒としてWeb系企業に勤めています。

幸運なことに新規案件に携わることができ、とても楽しくエンジニア生活をスタートさせることができました。  
今現在はReactとReduxを使って開発を行っていますが、そこでどうしても理解できないことがありましたので、それをご質問させていただきたいです。

複数のActionと複数のReducerが存在する場合、発行されたActionはどうやって自分自身が処理対象となっているReducerを特定しているのでしょうか?

先輩からは下記のように複数の互いに依存しないActionがある場合には、それ毎にReducerを作成し、Stateを変更する必要がある。ということで教わりました。  
複数のReducerが存在する場合は、combineReducersでrootReducerを作成しcreateStoreに対して、渡してあげる必要があることも教わりました。

[code]

    // Action
    export const actionA = status => ({
      type: 'A_ACTION',
      status
    })
    
    export const actionB = status => ({
      type: 'B_ACTION',
      status
    })
    
    // Reducer
    export const actionAReducer = (state = false, action) => {
      switch(action.type) {
        case 'A_ACTION':
          return action.status
        default:
          return state
      }
    }
    
    export const actionBReducer = (state = false, action) => {
      switch(action.type) {
        case 'B_ACTION':
          return action.status
        default:
          return state
      }
    }
    
[/code]

Reducerが1つであるうちは、Actionが発行された場合に適応されるReducerも1つであるため、「発行されたActionを元にReducerが変更を加える。」という説明が理解できましたが、複数のReducerが登場すると、いまいちこの説明だけでは腑に落ちません。

自分なりにもいろいろと書籍を購入しましたが、自分の知りたいところの説明は「発行されたActionを元にReducerが変更を加える。」という類似した文言でまとめられてしまっており、どうやった発行されたActionが自分自身を処理対象とするReducerを特定しているのか(もしくはそれを指定するような記述があるのか)がわかりませんでした。

稚拙な文章で申し訳ございませんが、ヒントでもよいのでご教授いただければ幸いです。  
よろしくお願いします。


CC BY-SA 4.0
2019-04-30T10:01:35.527
54605
2019-04-30T12:26:03.910
2019-04-30T10:18:56.407
34128
34128
question
javascript reactjs redux
発行されたActionをどうやって対応するReducerに渡しているのか


`combineReducer`で複数のreducerをまとめてrootReducerを作ったが、アクションを発行したときにどのreducerに渡すかの制御がどうなっているのか分からないという状況でしょうか。

ならば、答えは **全部のアクションが全部のreducerに渡される**
です。つまり、`actionB`で作ったアクションが`actionAReducer`に渡されたり、`actionA`で作ったアクションが`actionBReducer`に渡されたりすることもあります。

そのため、各reducerは **自分と関係ないアクションがやってきても無視する**
ように作られます。実際、`actionAReducer`は自分と関係ない`B_ACTION`がやってきた場合、`switch`文の`default`節が適用されて`return
state`という動作をします。これは「元々の状態をいじらずにそのまま返す」、つまり「 **何もしない**
」という動作です。`actionBReducer`についても同じです。

各reducerは自分の興味があるアクションに対して何らかの動作をして、自分に関係ないアクションがやってきても何もしないという動作をすればいいのです。こうすることで、それら複数のreducerを組み合わせて作ったreducerにアクションを渡すと、実際には裏で全てのreducerに対してアクションが渡されているにも関わらず、それに興味のある部分のreducerのみが反応して適切に状態が変化するように見えます。


CC BY-SA 4.0
2019-04-30T12:20:54.417
54606
2019-04-30T12:26:03.910
2019-04-30T12:26:03.910
30079
30079
54605
answer