[解決済み] JavaScriptでの非同期forサイクル
2023-04-30 07:14:01
質問
非同期呼び出しがあるまで待つループが必要です。次のようなもの。
for ( /* ... */ ) {
someFunction(param1, praram2, function(result) {
// Okay, for cycle could continue
})
}
alert("For cycle ended");
どうすればいいのでしょうか?何かアイデアはありますか?
どのように解決するのですか?
JavaScriptでは同期と非同期を混在させることはできません。スクリプトをブロックすると、ブラウザもブロックされます。
ここでは完全なイベント駆動方式にする必要がありますが、幸いにも醜いものを隠すことができます。
EDITです。 コードを更新しました。
function asyncLoop(iterations, func, callback) {
var index = 0;
var done = false;
var loop = {
next: function() {
if (done) {
return;
}
if (index < iterations) {
index++;
func(loop);
} else {
done = true;
callback();
}
},
iteration: function() {
return index - 1;
},
break: function() {
done = true;
callback();
}
};
loop.next();
return loop;
}
これにより、非同期の
loop
を提供します。もちろん、これをさらに変更して、例えばループの状態をチェックする関数を作成することもできます。
では、テストに入ります。
function someFunction(a, b, callback) {
console.log('Hey doing some stuff!');
callback();
}
asyncLoop(10, function(loop) {
someFunction(1, 2, function(result) {
// log the iteration
console.log(loop.iteration());
// Okay, for cycle could continue
loop.next();
})},
function(){console.log('cycle ended')}
);
そして、その出力。
Hey doing some stuff!
0
Hey doing some stuff!
1
Hey doing some stuff!
2
Hey doing some stuff!
3
Hey doing some stuff!
4
Hey doing some stuff!
5
Hey doing some stuff!
6
Hey doing some stuff!
7
Hey doing some stuff!
8
Hey doing some stuff!
9
cycle ended
関連
-
[解決済み】JavaScriptで「無効な日付」のDateインスタンスを検出する
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] JavaScriptで文字列が部分文字列を含むかどうかを確認する方法は?
-
[解決済み] あるJavaScriptファイルを他のJavaScriptファイルにインクルードするにはどうすればよいですか?
-
[解決済み] JavaScriptのオブジェクトが空であることをテストするにはどうすればよいですか?
-
[解決済み] forEachループでasync/awaitを使用する
-
[解決済み】オブジェクトからプロパティを削除する(JavaScript)
-
[解決済み] Chart.jsを使ってドーナツチャートの中にテキストを追加するには?
-
[解決済み] JavaScriptとLuaの微妙な違い [終了しました]
-
[解決済み] JavaScriptデータフォーマット/プリティプリンタ
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] JavaScript で範囲を作成する - 奇妙な構文
-
[解決済み] Google maps API V3 - 同一地点に複数のマーカーを設置する。
-
[解決済み] javascriptで2つの数値を連結する方法は?
-
[解決済み] 文字列が空白であるかどうかをチェックする
-
[解決済み] react-routerのハッシュフラグメントからクエリパラメータを取得する
-
[解決済み] TypeScriptプロジェクトで既存のC#クラス定義を再利用する方法
-
[解決済み] ECMAScriptとは?
-
[解決済み] Prototypeを使ってtextareaを自動サイズ調整するには?
-
[解決済み] なぜjavascriptのES6 Promisesはresolve後も実行を継続するのですか?
-
[解決済み] querySelectorAllがない場合、ライブラリを使用せずに属性で要素を取得する?