前提・実現したいこと
以下のhoge()
は、callback にある関数が終わる → fuga() を実行 → after にある関数を実行
と言う順序で実行する関数です。
jQuery
1// hoge を実行( callback にある関数が終わる → fuga() を実行 → after にある関数を実行 ) 2hoge({ 3 callback: [ get_usersA(), get_usersB() ], 4 after : [ ()=>{after_func()} ] 5});
上記callback
を、下記のように$.when.apply
で実行して結果をres
に受け取っているのですが、
jQuery
1 $.when.apply(null, callback).then( 2 function(...res){ 3 console.log('res =', res); 4 } 5 );
今回はこのres
にキーを付けたいと考えています。
つまりget_usersA()
の結果か、get_users_B()
の結果か、キーを指定してそれぞれ取得したい。ということです。
発生している問題
キーがないため、Aをres[0]
から、Bをres[1]
から取得しているのが現状です。
順序は保証されているっぽいのでこれでもいいのですが、キーがないとわかりにくい点を問題視しています。
Aをres.A
から、Bをres.B
から取得できれば理想的です。
該当のソースコード
全体のソースコードになります。
https://jsfiddle.net/6thzq2x8/
jQuery
1console.clear(); 2 3// hoge を実行( callback にある関数が終わる → fuga() を実行 → after にある関数を実行 ) 4hoge({ 5 callback: [ get_usersA(), get_usersB() ], 6 after : [ ()=>{after_func()} ] 7}); 8 9// 最後に実行 10function after_func(arg){ 11 console.log('after_func実行'); 12} 13 14// ユーザー情報Aを取得 15function get_usersA(){ 16 console.log('get_usersAを実行'); 17 const d = $.Deferred(); 18 setTimeout(function(){ 19 const users = [{id:1,name:'一郎'},{id:2,name:'二郎'}]; 20 d.resolve(users); 21 },2000); 22 return d.promise(); 23} 24 25// ユーザー情報Bを取得 26function get_usersB(){ 27 console.log('get_usersBを実行'); 28 const d = $.Deferred(); 29 setTimeout(function(){ 30 const users = [{id:3,name:'三郎'},{id:4,name:'四郎'}]; 31 d.resolve(users); 32 },1000); 33 return d.promise(); 34} 35 36// 順に実行 37function hoge( { callback = [], before = [], after = [] } = {} ){ 38 console.log('hoge()を実行'); 39 40 // callback が無い場合 41 if( !callback.length ){ 42 while( before.length>0 ){ before.shift()(); } 43 fuga(); 44 while( after.length>0 ){ after.shift()(); } 45 } 46 47 // callback がある場合 48 else{ 49 $.when.apply(null, callback).then( 50 function(...res){ 51 console.log('res =', res); 52 fuga( res ); 53 while( after.length>0 ){ after.shift()(); } 54 } 55 ); 56 } 57 58} 59 60// fugaを実行 61function fuga( res ){ 62 console.log('fuga()を実行'); 63 console.log('Aユーザー =', res[0]); // res.A のようにキー指定で取得したい 64 console.log('Bユーザー =', res[1]); // res.B のようにキー指定で取得したい 65}
試したこと
以下のようにcallback
の値を、関数の配列から、A
とB
のキーを付与したオブジェクトに変更して、
jQuery
1hoge({ 2 // callback: [ get_usersA(), get_usersB() ], 3 // ↓変更 4 callback: { A: get_usersA(), B: get_usersB() }, // キーを付与 5 after : [ ()=>{after_func()} ] 6});
そしてapply
で実行する配列を以下のようにObject.values
で作るよう変更したのですが、これでは実現できずでした。
jQuery
1//$.when.apply(null, callback).then( 2// ↓変更 3const arr = Object.values(collback); 4$.when.apply(null, arr).then(
同じようにPromise.all
も試しましたが残念ながらこちらも実現できずでした。
jQuery
1//$.when.apply(null, callback).then( 2// ↓変更 3const arr = Object.values(collback); 4Promise.all(arr).then(
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2022/02/21 07:15
2022/02/21 07:34
2022/02/21 07:58
2022/02/21 23:12