JavaScriptて何なの？何ができるの？簡単に覚えられるの？
今回はJavaScriptの超基本を一緒に学びましょう！
初心者さん向けにJavaScript（ジャバ スクリプト）の基礎をお伝えします。分かりやすいように、ざっくりと説明しますね。
JavaScriptはMicrosoft Edgeなどのブラウザ上で動くプログラム言語です。JavaScriptを覚えれば、シンプルな静止的なホームページに動きを付けることができますよ。ちょっとしたアニメーションやマウスを置いた時だけにボタンの色が変わったり、パスワード入力をしたりすることができます。
HTMLファイル内に一緒に書くことができるので、HTML、CSSの延長のプログラミング言語だと捉えると、覚えるのに苦にならないと思いますよ。
JavaScriptってなに？
スクリプト言語のひとつ
JavaScriptは1990年代にNetscape社が開発したLiveScriptを元に、Netscap社とSun社が共同開発したスクリプト言語です。
スクリプト言語とは、特に決まった定義がありません。特徴はプログラミングの習得の難易度が低いこと、プログラムの実行が割と気楽に簡単にできることがの2点にがあります。
この特徴だけでいえば、HTMLとCSSもプログラムの実行が、ファイルを開けばいいので簡単です。なので、JavaScriptもHTMLやCSSと同じで「あぁ、難しくないんだな」と思っていただければ十分です。
クライアントサイド言語
JavaScriptはブラウザ上で動くプログラム言語です。そのため、サーバとパソコンを行ったり来たりしなくてもいいので、実行は早いのが特徴です。
例えば、パスワードを入力する場合、パスワードが合っているかどうかをサーバーに問い合わせなくてもいいので、待つ時間がありません。
またGoogleChromeやMicrosoftEdgeなどほとんどのブラウザで実行することができます。
何ができるの？
JavaScriptは普段目にしているホームページの一部として動いています。
- 文字を動かす
- アンケートフォームの送信
- リンクボタンの上にカーソルを置いたとき、離したとき
- 小窓、ポップアップウィンドウを出す
- 画像をスライドショーで表示する
- ページ内リンクを滑らかに動かす
- クリックすると色を変えられる
- 計算機になる
などなど、あります。ホームページ以外にもゲームやアプリを作ることも可能です。
どこに書くの？
JavaScriptはHTMLファイル内に直接書く方法と、別ファイルを作る方法があります。CSSもHTMLファイル内に書く方法と別ファイルにする方法があります。イメージはCSSと同じような書き方になります。
HTMLファイル内に書く
HTMLファイル内にJava Scriptを書く場合は<script></script>タグを使用します。<body></body>の前半に書く場合と、</body>タグの直前に書く方法があります。
HTMLよりJava Scriptが優先されます。そのため、<body>タグの前半にJava Scriptを記述した場合、読み込みまれるまでHTMLが読み込まれないので、ホームページの表示に時間がかかります。最近は</body>の直前に書く方法が主流になっています。
- <script></script>内に書く
- <body></body>内に書く
- 最近は</body>の直前に書く方法が主流
別ファイルをつくる
別ファイルを作る場合は、拡張子が「.js」になります。それをHTMLファイルの<head></head>内で指定します。（Body内という人もいます）別ファイルを作ってJavaScriptを読み込めば、複数のファイルでも使えますし、変更が楽ですよ。
<script src="URL" type="text/javascript"></script>JavaScriptのマナー
マナーといっていいのか分かりませんが、JavaScriptの3つマナーをお伝えします。
- JavaScriptを無効にしている人へのメッセージ<noscript>
- コメントの書き方「//」「/* */」
- 文の区切り方「;」
JavaScriptを無効にしている人へのメッセージ<noscript>
ブラウザでJavaScriptを無効にしている場合、JavaScriptが実行されません。場合によっては何も表示されないことがあります。JavaScriptを無効にしている人に対して、JavaScriptを使用していることを伝えます。
<noscript>このページではJavaScriptが使われています</noscript><noscript>の後の「このページではJavaScriptが使われています」は任意の言葉です。JavaScriptを有効にしている人にはメッセージはでてきません。
コメントの書き方「//」「/* */」
Java Scriptでコメントを書く方法は2種類あります。「//」は一行でコメントが終わるとき。「/**/」は複数行にわたってコメントを書くときです。
文の区切り方「;」
「；」は文の区切りを表します。「；」がなくてもJavaScriptは文の区切りを判断しますが、自分自や仲間がコードを見たときにが分かりやすいようにするために、「；」は必ずつけるようにしましょう。
終わりに
今回は「基本のき」として、Java Scriptのイメージは掴めましたか？なんとなくHTMLやCSSに似ていて、ホームページの動きやアレンジに関わっているのだな、と思って頂ければそれでOKです。次回はJavaScriptの基本概念を分かりやすくまとめたいと思います。
もっと詳しいことを知りたい方はプログラミングのオンラインスクールCodeCampやTechAcademy [テックアカデミー]を受講されるといいと思いますよ。無料体験もあるので、ちょっと試すのもアリですよね。
JavaScriptは色々できるんだね。HTML、CSSと一緒に勉強した方が良さそうだね。