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

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

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

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Q&A

解決済

2回答

444閲覧

[Javascript] ajax外で無限ループ中にajaxのcomplete処理を走らせたい

yuuki4673

総合スコア5

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

0グッド

0クリップ

投稿2023/06/09 04:24

編集2023/06/09 05:32

発生している問題

ajax完了時の処理(complete)も非同期の想定だったので、
以下の「試したこと」で最終的に無限ループ中にcomplete処理を実行したかったのですが
無限ループから抜けられなくなってしまいました。

ajax外の処理中(無限ループなど)にcomplete処理を実行する方法を教えていただきたいです。
また、ajaxとajax外の処理の同期非同期について記載されているサイトを探したのですが、
見つからず、それについての記事等ありましたら教えていただけるとありがたいです。

試したこと

ajax処理開始時に実行中フラグを立て、
ajax処理実行中にキー押下イベントで処理が走った場合、
実行中フラグが立っている場合は無限ループしてajax終了を待つ。
ajaxの処理が完了したら完了時の処理(complete)でフラグを解除し、
無限ループ中の処理はフラグが解除されたことにより後続処理を実行する。

という確認をしました。

想定していたこと

ajaxは通信~complete処理まで非同期であるという想定でした。
そのため、ajax外で処理を行っている場合でも、非同期にcomplete処理が実行されることで
complete処理内でajax処理終了フラグ等を使ってajax外の処理で終了を感知できる想定でした。

試したソースコード

Javascript

1let ajaxProcessing= false; 2function AjaxExecute() { 3 ajaxProcessing= true; //★ここで実行中フラグを立てる 4 $.ajax({ 5 type: 'get', 6 url: //APIのURL, 7 async : true, 8 success: function (data) { 9 //成功時処理 10 }, 11 complete: function () { 12 ajaxProcessing= false; //★ここで実行中フラグを解除 13 } 14 }); 15 16$(document).on('keydown', function (e) { 17 while (ajaxProcessing) { //★ajax実行中フラグが立っていたら待つ 18 //〇〇秒待つ 19 } 20});

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

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

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

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

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

guest

回答2

0

ベストアンサー

ajaxは通信~complete処理まで非同期であるという想定でした。

そのとおりです。

ただし、JavaScriptはシングルスレッドであるため、同期的な無限ループが継続している間は、(非同期なものも含めて)他の処理を一切行えない状態となります。

keydownから特定の変数に書き込んで、それをcompleteで見る、という形で書くのが素直かと思います。

投稿2023/06/09 04:34

maisumakun

総合スコア145366

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

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

maisumakun

2023/06/09 04:35

別解として、async-awaitなどを使って非同期の無限ループを行う方法も考えられます。
yuuki4673

2023/06/09 05:01

ご回答ありがとうございます!なるほどです! 同期処理中には非同期処理も含めて処理ができないという点を知らず悩んでしまっていました。。 念のための確認で恐縮なのですが、 例えば無限ループではなく1万回ループなどにして、その間にajax処理が完了した場合 ループを行っているイベント処理が終了した後にcompleteが走る という認識で間違っていないでしょうか。
yuuki4673

2023/06/09 05:02

>別解として、async-awaitなどを使って非同期の無限ループを行う方法も考えられます。 別解ありがとうございます! 確かに両方とも非同期にする方式ならフラグの変化を感知できますね。 ありがとうございます!
maisumakun

2023/06/09 05:04

> 例えば無限ループではなく1万回ループなどにして、その間にajax処理が完了した場合 ループを行っているイベント処理が終了した後にcompleteが走る という認識で間違っていないでしょうか。 そのとおりです。ループ中に割り込むことはありません。
yuuki4673

2023/06/09 05:31

なるほどです。ありがとうございます! 同期・非同期について分かりやすく勉強になりました。 また解決方法も提示していただきとても助かりました。 本当にありがとうございました!
guest

0

「 ajaxProcessing= true; 」を AjaxExecute() の外側で宣言してみては?
そもそも通常はjsで無限ループはありえないと思いますが・・・

投稿2023/06/09 04:34

編集2023/06/09 04:37
yambejp

総合スコア115282

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

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

yuuki4673

2023/06/09 05:19

ご回答ありがとうございます! 失礼しました。。例に挙げたコードに記載漏れだったのですが、宣言自体は外側でしており、 どちらの処理からも見えるようにしております。 本当に実装したい処理は無限ループではないのですが、今回処理順を確かめたく大げさにするため無限ループにしていました。 ご指摘ありがとうございます!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.44%

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

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

質問する

関連した質問