キノコが何か作るブログ

ゲーム・ドット絵・アプリなどを作ります

MENU

JavaScriptは基本的に非同期で動くものだと勘違いしてた話

JavaScriptって非同期じゃないの?

関数Aの中で関数Bを実行するプログラムを書いたとします。

function A(){
  console.log('A Start');
  
  B();
 
  console.log('A finish');
}

function B(){
  console.log('B Start');
  //なんか重たい処理
  console.log('B finish');
}

A();

このとき、僕の中では
A Start → B Start → A finish → B finish
の順番でconsole.logが表示されると思っていました。

というのも、JavaScriptは基本的に非同期処理だと思っていたからです。
なので関数Bを実行した後はBが終わるのを待たずに次の処理を開始すると思ってました。
ですが、このプログラムを実行すると
f:id:mizukinoko:20200421152140p:plain
同期処理になってます。

でもsetTimeoutとかは非同期なんですよね。
時間のかかる処理は、特に何も指定してないのに勝手に非同期で動いてくれます。

どうなってるんだ?

JavaScriptは関数によって同期・非同期が最初から指定されているのではないか?
調べてみるとこちらの記事にそれっぽいことが書いてありました。
なぜJavascriptはシングルスレッドかつ非同期通信なのか | jiyu blog
一部抜粋

シングルスレッドだとファイルの読み込みなどの重い処理をしたときに次の処理まで長い待ち時間が発生しうる。
それだと使い者にならないので、そのような処理は処理を投げる(ファイル読み込みの場合はhttpリクエストをブラウザに投げる)ことだけをまず行い、イベントループにでぶち込んで他の処理を行う

JavaScriptはシングルスレッドです。スレッドが一つしかないので、時間のかかる処理をする場合はフリーズしないように非同期を使うことになります。
なのでsetTimeoutやHTTP通信のような、あらかじめ時間が掛かると分かっている処理は非同期で処理をするようになっているみたいです。

終わり

アホみたいな話ですが、JavaScriptの関数は全部非同期で動くものだと本気で思ってました。
今作っているゲームも「JavaScriptが非同期で動く」ということ前提で作っているので、色々と直したほうがいい部分が出てきてます。
というか、今まで公開したコードも全部見直さないといけません。
間違っている部分があったらすみません。後々直しておきます。

プライバシーポリシー