【JS】前の行の処理を完了してから次の行の処理を行いたい
Table of Contents
やりたいこと
JavaScriptで処理Aが完了してから処理Bを実行したい。
たとえばPHPなどの場合、前の行で関数Aを呼び出したとすると、次の行が実行されるのは関数Aの戻り値が来た後になります(関数Aに戻り値がある場合)。しかしながらJavaScriptの場合、サイトの表示などに使われる関係で、表示速度を速めるために、前の行の処理の完了を待たずにその後の行を実行します。
すると、たとえば先述のように、関数Aの戻り値が来た後に次の処理を実行したい場合は、少し工夫をしなければなりません。その方法を今回は解説したいと思います。
サンプルコード提示・解説
1 2 3 4 5 6 7 |
処理A; hoge = setInterval(function(){ if(処理Aが終わったことを示すフラグ){ clearInterval(hoge); //処理B } }, 間隔); |
上のコードのように、setIntervalを使うと処理A完了後に処理Bを実行するということが実現できます。
具体的に何をしているかといいますと、setIntervalの第2引数に指定する時間毎に、処理Aが完了しているかどうかを確かめて、処理Aが完了していたら処理Bを実行せよ、というようなコードになっています。