【じゃばすくりぷと】

JavaScript とは?

最終更新:
💡 クリックに反応して、Webページを動かす

Webページの操作への反応や、計算、通信などに使うプログラミング言語。ブラウザーではHTMLやCSSと組み合わせて使い、Node.jsなどの実行環境ではサーバー側でも動く。Javaとは別の言語。

📌 このページのポイント
JavaScript — クリックに反応するボタンをクリック回数を1増やす表示が変わるHTML:ボタンなどの構造CSS:見た目 JS:反応や処理Webの外でも、Node.jsなどで動く
ボタンを押した回数を表示する例。HTML・CSS・JavaScriptがそれぞれの役割を担う。
ひよこ ひよこ
JavaScriptって、何に使うの?
ペンギン先生 ペンギン先生
たとえばボタンを押した回数を数え、画面に表示するような処理だよ。入力に応じて内容を変えたり、サーバーからデータを受け取って表示したりできる。ブラウザーがJavaScriptを実行し、DOMというページの内容を扱う仕組みなどと組み合わせて動くんだ。
ひよこ ひよこ
HTMLやCSSとは、どう違うの?
ペンギン先生 ペンギン先生
HTMLは見出しやボタンなどの内容と構造、CSSは色や配置などの見た目を担当するよ。JavaScriptは操作に応じた処理や計算を担当する。CSSだけでできるアニメーションなどもあるので、「動くものは全部JavaScript」とは限らないんだ。
ひよこ ひよこ
Javaの短い版、ということ?
ペンギン先生 ペンギン先生
Javaとは別の言語だよ。名前や一部の書き方は似ているけれど、JavaのコードをそのままJavaScriptとして実行できるわけではない。学習するときも、Java向けの教材かJavaScript向けの教材かを確かめよう。
ひよこ ひよこ
ブラウザーでしか動かないの?
ペンギン先生 ペンギン先生
Node.jsなどを使えば、ブラウザーの外で動かせるよ。サーバーで要求に応答したり、ファイルを扱う処理にも使える。ただし、ブラウザーの画面を扱う機能が、そのままNode.jsにもあるわけではない。またブラウザーにはWebAssemblyもあるので、JavaScriptを「唯一動く言語」とは言い切れないんだ。
ひよこ ひよこ
非同期処理って、何のためにあるの?
ペンギン先生 ペンギン先生
通信の結果が届くまで、ほかの処理を進めるための仕組みだよ。Promiseやasync/awaitは、その完了や失敗を扱う書き方なんだ。ただし長い計算が自動で別の場所へ移るわけではない。画面側の処理を長く占有すると反応が遅くなるので、短く分けたり、Web Workerで別の実行役へ分けたりする設計が必要だね。
ペンギン
まとめ:ざっくりこれだけ覚えればOK!
「JavaScript」って出てきたら「Webページの操作や処理を動かすプログラミング言語」と思えばだいたいOK!
📖 おまけ:英語の意味
「JavaScript」 = ジャバスクリプト
💬 略してJSとも書くよ。Javaとは別のプログラミング言語なので、名前が似ていても区別しよう。

参考資料

← 用語集にもどる