Dance with Agents

そもそもJavaScriptとは何か——名前で損している言語

HTMLが意味を、CSSが見た目を担当することは、それぞれの記事で見たとおりです。残るもう1つの役割——「動き」を担当するのが、この記事で扱うJavaScriptです。React・Vue・Next.js・Astroといったフレームワークも、すべてこの言語の上に成り立っています。

Javaとは別物

最初に片付けておきたい誤解があります。JavaScriptは、Javaという別のプログラミング言語とは、ほとんど関係がありません。 名前が似ているのは偶然ではなく、1995年の命名時にJavaが人気を集めていたことにあやかったマーケティング上の判断でした。

作ったのはBrendan Eich氏で、Netscape社(当時の主要なブラウザメーカー)で、わずか10日ほどで最初の版を書き上げたと言われています。開発時の仮の名前は「Mocha」、その後「LiveScript」を経て、最終的に「JavaScript」という名前に落ち着きました。この経緯を知らないと「Javaの簡易版」のような誤解をしがちですが、文法も設計思想も別物の、独立した言語です。

すべてのブラウザで動く、唯一の言語

JavaScriptの価値の核心はここにあります。世界中のあらゆるWebブラウザに、あらかじめ組み込まれている唯一のプログラミング言語です。 何かを追加でインストールしなくても、ブラウザさえあれば動きます。

Webページを作る3つの要素で例えると、役割分担がわかりやすくなります。

要素 役割
HTML ページの構造(見出し、段落、ボタンなどの骨組み)
CSS 見た目(色、余白、配置)
JavaScript 動き(クリックしたら何かが起きる、入力内容をその場で確認する、といった振る舞い)

ドロップダウンメニューが開く、フォームの入力ミスをその場で教えてくれる、ページを移動せずに内容が切り替わる——こうした「動き」のあるWebページは、裏でほぼ確実にJavaScriptが動いています。このサイトの検索やタグの絞り込みも例外ではありません。

サーバー側まで、同じ言語で書ける

もう1つ、価値のわりに知られていない事実があります。JavaScriptは、ブラウザの中だけの言語ではありません。

2009年、Ryan Dahl氏がNode.jsというソフトウェアを作り、ブラウザの外——サーバー側やパソコン上——でもJavaScriptを動かせるようにしました。これによって、画面側(フロントエンド)とサーバー側(バックエンド)を、同じ1つの言語で書けるようになりました。 多くの言語は「この言語はブラウザ向け」「この言語はサーバー向け」と役割が分かれていますが、JavaScriptは両方をまたいでいます。Node.js自体の詳しい仕組みは、別記事で改めて扱う予定です。

しょぼい飾りから、世界を支える言語へ

JavaScriptには、評価が大きく変わった歴史があります。1990年代後半から2000年代前半にかけて、JavaScriptは「マウスカーソルに星や絵文字がついてくる」「文字がチカチカ点滅する」といった、ページの飾り付け程度にしか使えない言語という扱いを受けていました。 実用的な処理は結局サーバー側の言語(当時はPerlやPHPなど)が担い、JavaScriptは“おまけ”という位置づけです。

この評価を一変させたのが、2005年前後に広まったAjaxという手法です。ページ全体を読み込み直さず、裏側でサーバーとデータだけをやり取りして画面の一部を書き換える——この仕組みを使った代表例が、当時登場したばかりのGoogleマップでした。地図をドラッグすると、ページの再読み込みなしに、なめらかに次のエリアが表示される。当時としては衝撃的な体験で、「JavaScriptで、ここまでちゃんとしたアプリが作れるのか」という認識が一気に広がりました。「Ajax」という呼び名自体も、この流れの中で2005年に定着した言葉です。

ここから先は、評価が変わるどころかなくてはならない言語になっていきます。前述のNode.jsでサーバー側にも広がり、React・Vueのようなフレームワークが次々に生まれ、いまではJavaScriptなしでは成立しないWebサービスのほうが多いくらいです。

技術面での成長も伴っています。現在のJavaScriptはECMAScript(略称ES)という名前で標準化団体ECMA Internationalの規格として整備が続いていて、let・constによる変数宣言、async/awaitによる非同期処理(時間のかかる処理の完了を待つ間、ほかの作業を止めずに進められる書き方)の書きやすさなど、初期の書きにくさを解消する改善が積み重なっています。加えて、型のゆるさという弱点を補うTypeScriptという選択肢も普及しました。

この記事を含め、Astroで作られているこのサイト自体も、React・Vue・Next.jsも、裏側で動いているのは結局JavaScript(またはそれを拡張したTypeScript)です。画面を作るための道具の名前は次々に変わっても、その土台は変わらずJavaScriptだった、というのがこのカテゴリを通して伝えたいことです。

管理人にとっても、世界が広がった言語

HTMLとは何かに書いたとおり、管理人はフリースクールを運営していた20代後半に、ホームページビルダーから手書きのHTMLへと移っていきました。同じ時期に触れ始めたのがJavaScriptです。HTMLで「書いたものがそのまま画面になる」感覚を覚えたあと、JavaScriptで画面が「動く」ようになったときの感覚は、また別の広がりでした。

このサイトについてにあるとおり、その後フリーランスとしてサイト制作を請け負う中で、JavaScriptやPHPを本格的に覚え、システム構築まで手がけるようになっていきます。世の中の評価が「おまけの飾り」から「ちゃんとしたアプリが作れる言語」へと変わっていったのは、ちょうどこの時期と重なります。

まとめ

  • JavaScriptは、名前は似ていてもJavaとは別物の言語
  • すべてのブラウザに標準で備わっている唯一の言語で、Webページの「動き」を担う
  • Node.jsのおかげで、サーバー側も同じ言語で書けるようになった
  • かつては「ページの飾り付け程度」の言語と見られていたが、2005年前後のAjax(Googleマップが代表例)を境に評価が一変し、いまではなくてはならない言語になった
  • 標準化(ECMAScript)と改善が進み、TypeScriptという発展形もある
  • React・Vue・Next.js・Astroは、すべてこの言語の上に成り立っている道具

「名前だけは聞いたことがある」で止まっていた人にとって、その名前の裏にある実態が伝われば十分です。

プログラミング・環境構築の記事

プログラミング・環境構築のページへ →