25
19

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

redux-saga用語

Posted at

最近redux-sagaについて調べていたのだが、用語の理解が曖昧だったので公式ドキュメントのGlossaryを雑に訳してみた。

Effect

effectとはsaga middlewareによって実行される命令を含むプレーンなJavaScriptオブジェクトです。
redux-sagaライブラリが提供するファクトリ関数を使うことでeffectを生成できます。 例えば、call(myfunc, 'arg1', 'arg2')が返すeffectをyieldすることによって、middlewareに対してmyfunc('arg1', 'arg2')を呼び出して結果をGeneratorに返すよう指示します。

Task

taskはバックグランドで走るプロセスのようなもので、redux-sagaを使ったアプリケーションでは複数のtaskが並列に動作します。fork関数を使うと下記のようにtaskを生成できます。

function* saga() {
  ...
  const task = yield fork(otherSaga, ...args)
  ...
}

Blocking/Non-blocking call

Blocking callはSagaがeffectをyieldしてその結果を待ってから次の命令を再開すること、またNon-blockingはeffectをyieldしたあとすぐに処理を再開することを指します。

function* saga() {
  yield take(ACTION)              // Blocking: actionが来るのを待つ
  yield call(ApiFn, ...args)      // Blocking: ApiFnが終わるのを待つ (ApiFnがPromiseを返す場合)
  yield call(otherSaga, ...args)  // Blocking: otherSagaが終わるのを待つ

  yield put(...)                   // Blocking: 非同期にdispatchする (Promise.thenを使用)

  const task = yield fork(otherSaga, ...args)  // Non-blocking: otherSagaの終了を待たない
  yield cancel(task)                           // Non-blocking: すぐに再開する
  // または
  yield join(task)                              // Blocking: taskが終わるのを待つ
}

Watcher/Worker

独立したSagaを使って制御フローを組織化する方法を示します。

  • The watcher: dispatchされたactionを監視して、actionごとにworkerをforkする
  • The worker: actionを処理して終了する
function* watcher() {
  while (true) {
    const action = yield take(ACTION)
    yield fork(worker, action.payload)
  }
}

function* worker(payload) {
  // ... 何らかの処理
}

まとめ

少しだけ理解が深まったような... 更に曖昧になったような...
訳がかなり怪しいので間違っている点があれば指摘していただけるとありがたいです。

25
19
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
25
19

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?