【JavaScript】動作の仕組み（非同期、シングルスレッド、イベント駆動等）

非同期処理が基本

JavaScriptは、「非同期処理が基本」と言われています。

では、非同期処理って何でしょうか？普通のJavaとかのプログラミング言語ではあまり聞きなれない言葉ですよね。

同期・非同期とは？

わかりやすく言えば、「ソースコードの処理が一本道で書かれているかどうか？」ということです。

同期処理

Java等の言語では、基本的には同期処理で動いています。（ただ、マルチスレッドをさせるために、非同期メソッド等もありますが…）

非同期処理

JavaScriptの場合は、「非同期処理」なので、基本的には一本道ではなく、色々なコードに飛び移りながらソースが実行されます。

通常のプログラムであれば、何か関数を呼び出した場合は、その関数が終了するまでは次の行の処理に移ることはありません。

しかし、JavaScriptのようなWebプログラムの場合は、サーバーとの通信の結果数秒も待たされてしまうと困ります。その時点でWebページが止まってしまったら「何だこのページは！？」ってことになり、影響が大きいですからね。

そこで考え出されたのが、「一度関数を呼び出した場合は、一度呼び出し元に戻り、関数の結果を戻せる状態になったら呼び出し元に通知をする。」という仕組みが考えられました。

これを「非同期処理」と呼んでいるのです。

シングルスレッド

JavaScriptは、「シングルスレッド」なので、二つの処理を並列して実行させることができません。

なので、片方の処理が非常に長いと、そこで処理自体が止まってしまいます。

処理が止まってしまわないような対策

そこでJavaScriptでは、「イベントループ」と呼ばれるループを作って、そこに「キュー」をためる形でタスクを処理していくようになっています。

イベントループとは？

イベントをずっと監視して待っているようなループ構造のことです。

イベント駆動(イベントトリブン)型

JavaScriptは、ブラウザ上で動くということもあり、「マウスをクリックしたタイミング」、「マウスを動かしたタイミング」等利用者の操作に応じて処理をするという「イベント駆動」の概念が取り入れられています。

具体的には、下記の記事で使い方を解説しています。

【JavaScript】イベントハンドラ、イベントリスナについて

ディスク上のデータの書き換えはできない。

JavaScriptは、セキュリティ上の観点からディスク上のデータの書き換えはできません。

例えば、あるサイトにアクセスした際に、自分のＰＣのローカルのファイルを削除されるというプログラムが組まれていたら、大多数の人が困るでしょう。

そういう意味で、JavaScriptでは、ディスク上のデータの書き換えは、禁止されているのです。

ディスク上に書き込む方式の例外「クッキー（Cookie）」

基本的には、JavaScriptからコンピュータにデータを書き込むことは出来ませんが、その例外として「クッキー（Cookie）」と呼ばれる仕組みを提供しています。

クッキーを利用することで、クライアントに対して、小さなテキストを保存することができました。

詳しくは、下記の記事で解説しています。

【Webセキュリティ】クッキーの仕組み

新たなデータ蓄積手法「Web Storage(ストレージ)」

クッキーを使えば、クライアントにデータを蓄積することができました。

しかし、クッキーでは、下記のデメリットがあります。

• JavaScriptからは操作がしずらい。
• サイズも制限されている。

そこであらたに登場した技術として「Web Storage(ストレージ)」という技術が登場しています。

詳しくは、下記の記事でも解説しています。

【JavaScript】「Web Storage(ストレージ)」、ローカルストレージの実装など