JavaScriptによるプログラミングに関する世界観です。
JavaScriptフレームワークやjQueryやMozillaも参照のこと。
JavaScriptは、Webページ上で、素のHTMLだけではできないことをやるために使います。
たとえば、ページを下にスクロールしたらメッセージのログが自動的に表示されるようにしたり、ページの内容をタブでポチポチ切り替えられるようにしたり、画像をスライドして左から右へと次の画像が切り替わるようにしたり、画像をクリックしたら中央に拡大表示されるようにしたり、閉じるボタンでその拡大画像が消えるようにしたり、あるいはメニューや目次といった素のHTMLではできないパーツを作ったり、マウスやキーボードの動作や入力に対応したり、ソースコードをシンタックスハイライトしたり、ということができます。
これらの機能は、素のHTMLでは実現できませんが、JavaScriptを使ってHTMLやその構成要素となるDOMツリーを操作することで実現出来ます。
また、最近はJavaScriptフレームワークという、より高度かつ保守性の高いJavaScriptプログラミングを簡単にできるフレームワークもあります。これを使うことで、シングルページアプリケーション(SPA)を開発したりできます。認証や永続化には、Firebaseのようなサービスを使うこともできます。
このように、ある意味でUIツールキットのような側面があるJavaScriptですが、最近ではサーバーサイドやデスクトップアプリケーションもJavaScriptでできるようになってきています。「JavaScriptさえ覚えればなんでもできる」ような世界が訪れるかもしれません。
自分の書いたブログ「神々とともに生きる詩人」2021/02/05より。
JavaScriptと聞くと、僕のような昔の世代は、「Webページを読みづらくするお邪魔なスクリプト」と思う人がいるかもしれません。
JavaScriptは、WebブラウザのNetscape社が開発した言語で、Webページをブラウザ上で書き換えたり、ブラウザに組み込まれた機能を使って、さまざまなことができるマクロ言語として、開発されました。
Mozillaも参照のこと。
当時、Javaと言えば、サン・マイクロシステムズによって開発された、Java言語が知られていました。
Javaはさまざまな環境で動くオブジェクト指向言語でしたが、インターネットユーザーによく知られていたのが、アプレットと呼ばれる機能で、Webブラウザ上で描画領域を表示したり、アニメーションをしたり、HTMLでは簡単にできない計算処理ができました。
アプレットから、Javaの存在を知った方も多いでしょう。
また、当時はオブジェクト指向が大流行しており、C++に代わる新しい設計のJavaは大成功していました。
JavaScriptは、このJavaの成功にあやかって、アプレットと同じようにブラウザ上で動く言語として、サンとネットスケープの業務提携から、JavaScriptという名前になりました。
しかしながら、この2つは、名前が似ているだけで全く異なる言語です。
Javaは、仮想マシンのサンドボックス環境で、ブラウザとは全く異なるVMの上で実行されます。
これに対して、JavaScriptでは、ブラウザのHTMLをツリー構造にした、DOMツリーを直接操作でき、エンジンも完全にブラウザに組み込まれています。
Javaも参照のこと。
さて、そのようなJavaScriptですが、Webの世界では嫌われ者でした。
ポップアップ広告を勝手に表示したり、ブラクラとしてブラウザをクラッシュさせたりなど、まともでない用途に使われることが多かったためです。
もう少しマシな用途では、文字列を横スクロールさせたり、画面に雪を降らせたりなど、ほとんどが「ページを見づらくするだけ」だったのです。
しかしながら、JavaScriptには潜在的な可能性があり、それに目を付けたのがGoogleです。
Googleは、Google Mapsという地図アプリで、Ajaxと呼ばれる非同期通信技術を用いて、JavaScriptをふんだんに使った、GUIのウィンドウアプリケーションと同等の、使いやすいサービスを開発しました。
これが「Ajaxブーム」を引き起こします。
その後も、GoogleはGmailなど、多くのアプリケーションをJavaScriptで作成します。
ここから、「JavaScriptは上手に使えば良いものである」と人々は気付き、従来PHPなどで行っていたことを、Ajaxを使えばインタラクティブにできると知られます。
Ajaxも参照のこと。
次のキーパーソンは、Railsです。
RailsをはじめとするMVCフレームワークは、Webにとっての一種の革命で、モデル、ビュー、コントローラの構成で、繰り返しを排除し、設定より規約を守ることで、とても簡単にWebアプリケーションを開発できるようになりました。
従来PHPなどで行っていたことが、RubyとRailsによってとても生産性が向上したのです。
Ruby on Railsも参照のこと。
しかしながら、RailsのようなMVCフレームワークは、モデル、ビュー、コントローラを、全てサーバーサイドで処理していました。
データベースを担当するモデルや、全体のコントロールを担当するコントローラは、確かにサーバーサイドの処理が必要ですが、HTMLを担当するビューについては、JavaScriptを上手く使うことで、クライアントサイドでも実現できるということが、次第に分かってきました。
また、先のAjaxのように、Web業界が高度化し、JavaScriptアプリケーションが複雑になるにつれて、サーバーサイドのMVCフレームワークだけでなく、クライアントサイドのHTML/CSS/JavaScriptの環境でも、同様の生産性の高いフレームワークが要求されます。
ここに登場したのが、React, Angular, Vue.jsをはじめとする、JavaScriptフレームワークです。
はじめのうち優勢だったのはGoogleのフルスタックのAngularでしたが、今ではビューだけに特化したFacebookのReactが勝っています。
また、簡単なテンプレート処理にも使えて、少しずつたくさんの機能を使えていける、Vue.jsは日本などのアジア地域で、Reactと同じくらい流行しています。
JavaScriptフレームワークやNode.jsも参照のこと。
JavaScriptには、公式のドキュメントのようなものはありませんが、MozillaのMDNがほとんど公式と言ってよいでしょう。JavaScriptだけではなく、HTML/CSSなどのWeb技術をやりたい人にとって準公式の情報源になります。困ったらMDNの記述に頼りましょう。
また、ブラウザとして使う場合では、IEなんか使っていてはいけません。Google ChromeかMozilla Firefoxを使いましょう。開発のために使える機能がたくさんあります。
JavaScriptはクライアントサイドのプログラミング言語。
Perl/PHPのようにサーバーサイドでHTMLを吐くために使うのではなく、ブラウザ上でHTMLを操作するために使う。
Perl/PHPが掲示板やブログを作るためにあるとするなら、JavaScriptはブラウザ上でインタラクティブな操作や処理を行うためにある。
DOMではHTMLを「ノード」の階層構造として表現する。
ドキュメント要素を取得するには、たとえばgetElementByIdなどで行い、書き換えるにはinnerHTMLなどで行う。
最近はdocument.writeよりもinnerHTMLやinsertAdjacentHTMLやappendChildを使うべきだとされている。
クラスとはまた違う、「プロトタイプを作ってオブジェクトを量産する」かのようなオブジェクト指向のスタイル。
特に「委譲」と呼ばれる新しいオブジェクト指向の概念(あるオブジェクトの操作を別のオブジェクトにしてもらうようにお願いを立てる)がある。
関数定義と同一スコープの変数に関数内部からアクセスできる。
Ajaxを使うことで、Google MapsのようにWebサービスでもGUI並みのインタラクティブな処理が可能となる。
基本文法。
JavaScript
スライド。JavaScriptでは、クラスベースではなく、プロトタイプベースと呼ばれる独自のオブジェクト指向を行います。クラスはありません。
書籍