JavaScriptを本格的に勉強するにあたって、そもそもJavascriptって何ができるのってところをまとめておく。利用シーンを押さえておけば気づけることもあるかもしれないしね!
動的にWebページを変化させる
一番ベーシックな使い方。HTMLに組み込んでおいて、(基本的に)ユーザの操作に応じて動的にページを変化させることができる。Ajax(非同期通信)も可能。
最近ではJavascriptとしてよりもjQueryとして見かけることが多い。jQueryはJavascriptの便利なライブラリ?的な位置づけ。jQuery自体にも拡張プラグインみたいのがいっぱいあるみたい。
とりあえず、リッチなページを作るためには欠かせない。
ブックマークレット作成
これもブラウザに関係する動作ではあるけれども、予めお気に入りに登録しておいて、任意のページを開いてる状態で実行するってもの。
お気に入りに登録されるURLのところにjavascriptを書いて、それを適応させるというちょっと荒業チックな代物みたいです。ページを開いたままお気に入りに登録したボタンを押すと短縮URLが生成される、なんてのは、まさにこれを利用しているっぽいです。
例としては以下のような感じ。
この例は、Googleのパーソナライズド検索を無効にするブックマークレットだそうです。グーグルの検索結果画面で、これを紐付けたお気に入りボタンを押すと、パーソナライズド検索が無効になった検索結果がでてくるという仕組みです。
javascript:(function(){location.href=location.href+'&pws=0'})();
やっていることは、いまの検索結果URLに対して、クエリパラメータpws=0を追加しているだけです。これを追加すると、パーソナライズド検索が無効になるってことらしいですね。
ちなみに、以下のページから流用しました。
ログアウトせずにGoogleのパーソナライズ検索を無効にする方法
WSHでローカルアプリ作成
これは衝撃でした。VBAとかVBSのようにJavascriptが使えるんですね。WSHはWindows Script Hostの略で、ざっくり説明だと、テキストに書いたプログラムを実行してくれるエンジンみたいな感じです。
拡張子は「js」でもいいが、関連付けでエラーが起きやすいので、「wsf」推奨っぽいです。
HelloWorldなら以下の様な感じで簡単に書けます。
<?xml version="1.0" encoding="UTF-8" ?> <job id="main"> <script language="JavaScript"> WScript.Echo("Hello World"); </script> </job>
これは結構衝撃的でした。windowオブジェクトの代わりにWScriptってオブジェクトを使うみたい。でも、この次のHTAってのが一番衝撃的でした…
HTAでウィンドウ付きローカルアプリ作成
もはやJavascriptと言っていいのかすらわかりませんが、html文書を「hta」という拡張子に変えるだけで、ブラウザではなく、windowsの正規のウィンドウとして表示されます。
これで、見た目はC++とかVBで作ったプログラムと同じ!!(同じは言い過ぎですかね 笑)
ただ、これはHTMLそのままだと、うまく動く部分と動かない部分があるみたいでした。
positionがabspluteになってる要素の表示がイマイチっぽかったですが、詳細はよく調べてないです。本格的に使う場合はもう少し調査が必要かもしれないです。
おしまい
全体的に以下のサイトで勉強をしました。わかりやすくまとめられていて非常に勉強になりました!
マンガで分かる JavaScriptプログラミング講座 第2版
本当はあとはnode.jsとかサーバサイドの利用に関してもあるのかなぁと思いつつ。とりあえずは、webページでの利用が目的なので、今回はこんな感じです。