Reduxストアの概念をRubyで再実装して理解する(翻訳)

概要 原著者の許諾を得て翻訳・公開いたします。 英語記事: Understanding Redux store concepts by little Ruby reimplementation 原文公開日: 2018/01/30 著者: Josef Strzibny なお、reducerは「レデューサー」「リデューサー」の2とおりのカタカナがあるようですが、ネットで多数派の「レデューサー」にしました。 Reduxストアの概念をRubyで再実装して理解する(翻訳) Reduxは最近のJavaScriptアプリのステート管理ライブラリとして人気が高まっており、実際にはその中心にシンプルなデータストアがあるだけです。Reduxのストアは他と何が違うのでしょうか?データを保存する点では他のストアと同様ですが、Reduxのデータ変更は常に「アクション」を「レデューサー」と呼ばれるものにディスパッチすることで行い、サブスクライブしているリスナーに通知します。Reduxストアの話をするときには、「レデューサー」「アクション」「リスナー」の概念を理解しておく必要があります。 レデューサー(reducer)はRedux世界でよく知られた名前であり、ステートとアクションを引数として受け取り、新しいステートを返す純粋関数を指します。ある関数が「純粋」である場合、関数に副作用がないことを意味します。純粋関数は常に新しい値を返し、受け取った値(関数に渡した元のステート)を変更することは決してありません。よく例として使われるカウンタレデューサーを見てみることにしましょう。カウンタレデューサーは、カウントアップ(increment)やカウントダウン(decrement)に応答する方法を知っており、それ以外のデータを追加しません(Gist)。 counter_reducer = -> (state, action) { state ||= 0 case action[:type] when ‘increment’ state += 1 when ‘decrement’ state -= 1 else state end } 上のRubyコードがJavaScript版と唯一異なっている点は、関数定義でlambda(無名関数)を使っていることと、アクションの定義にRubyのハッシュ(JavaScriptのオブジェクトと対になります)を用いている点です。ステートは常に引数として渡されますが、デフォルト値(ゼロからカウントアップする)も与えています。これで新しいカウンタレデューサは、カウントアップとカウントダウンのアクションに応答し、カウンタの適切な新しい値を返すようになります。ここでもうひとつ注目したい重要な点は、カウンタレデューサーは指定のアクションへの応答方法については何の知識も持たず、元のステートを無変更のまま返していることです。ここが後で重要になってきます。 新しいカウンタは次のように使います。 counter.call(2, { type: ‘increment’ }) #=> 3 counter.call(nil, … Continue reading Reduxストアの概念をRubyで再実装して理解する(翻訳)