質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Redux

Reduxは、JavaScriptアプリケーションの状態を管理するためのオープンソースライブラリです。ReactやAngularで一般的にユーザーインターフェイスの構築に利用されます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

解決済

1回答

217閲覧

shorthand 構文が知りたい

tommyTeratail

総合スコア31

Redux

Reduxは、JavaScriptアプリケーションの状態を管理するためのオープンソースライブラリです。ReactやAngularで一般的にユーザーインターフェイスの構築に利用されます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

0クリップ

投稿2018/09/11 08:14

ES6 以降の構文で出来そうな気がしますが思いつかないです..

js

1// これを 2const mapDispatchToProps = dispatch => ({ 3 fetch: async ({ id }) => { 4 await dispatch(fetchFoo({ id })); 5 }, 6}); 7 8 9// こんな感じにしたい 10const fetch = dispatch => async({ id }) => { 11 await dispatch(fetchFoo({ id })); 12}; 13 14const mapDispatchToProps = dispatch => ({ 15 fetch 16});

bind使えば出来そうな気がしますが...

Ramda.js使っても構いません

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

まずasyncが即return new Promise(fn)をするだけの糖衣構文なので、
普通にこれが最小単位だと思います。

JavaScript

1const mapDispatchToProps = dispatch => ({ 2 fetch: options => dispatch(fetchFoo(options)), 3});

削ったawaitに微妙に挙動が変わりますが、
結局返すのはPromiseのインスタンスだし、
この時点でわざわざ待つメリットは殆どないと思います。
必要なタイミングになったら、その時に改めてawaitなりthenで繋ぐなりして待つべきでしょう。


bind使えば出来そうな気がしますが...

bindの書き方はスコープ, [引数]です。
スコープを使わない場合はnullでも入れておけば十分でしょう。

JavaScript

1const fetch = (dispatch, options) => dispatch(fetchFoo(options)); 2const mapDispatchToProps = dispatch => ({ 3 fetch: fetch.bind(null, dispatch), 4});

関数化して切り出したければ、curry化という案もあります。

JavaScript

1const curry = (fn, ...args) => 2 args.length >= fn.length 3 ? fn(...args) 4 : curry.bind(null, fn, ...args); 5const add = curry((a, b) => a + b); 6 7console.log(add(1)(2)); // 3 8console.log(add(1, 2)); // 3

このcurryを使ってfetch関数を準備します。

JavaScript

1const curry = (fn, ...args) => 2 args.length >= fn.length 3 ? fn(...args) 4 : curry.bind(null, fn, ...args); 5const fetch = curry((dispatch, options) => dispatch(fetchFoo(options))); 6const mapDispatchToProps = dispatch => ({ 7 fetch: fetch(dispatch), 8});

Ramda.js使っても構いません

実践的には私が作った手抜きcurryより、
Ramda.jsのcurryを使った方が良いでしょう。

投稿2018/09/11 08:37

miyabi-sun

総合スコア21158

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

tommyTeratail

2018/09/12 01:13

丁寧な回答ありがとうございます 下記で動くのでもしかしてと思いましたが、 勉強不足でした ```js const f = () => console.log('fだよ') const obj = { f } obj.f() ``` [最小構文に関して] mapDispatchToProps の中に書くようにします [bind, curry] 今回の場合はメリットが無さそうなので避けます サンプルコードありがとうございます
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問