今日も牛山くんと猫田さんは雑談です。
HTMLとCSSもなかなか奥が深いですね。これらが終わったら、いよいよ本格的なプログラミング学習に入るわけですが……どの言語を最初に学ぶか、猫田さんは決めました？
んんー イマイチよくわかっていないんだよねー
やっぱりそうですか。実は、僕もどのプログラミング言語を学ぼうか、決めかねているんですよ
二人がそんな話をしているとキャニット先生がやってきました。
二人の話が聞こえてきましたよ。HTMLとCSSが終わったら、Javascriptを最初に学ぶ人が多いみたいですよ
Javascript……名前はよく聞きますね
Javascriptの名前はよく聞くけど、具体的に何ができるようになるのかよくわからないのよね
なるほど。たしかに今までJavascriptの詳しい説明はしてこなかったかもしれませんね。せっかくなので、今回はJavascriptについて詳しく紹介しましょうか。Javascriptを学べばどのようなことができるようになるのか、お話ししましょう
というわけで、今回はプログラミング初心者に向けてJavascriptの紹介をします。
Javascriptとは何か
Javascriptは、Web上のページに動きを与えることが主な役割のプログラミング言語です。
開発されたのは1990年代はじめで、最初はNetscape Navigatorというブラウザ専用のプログラミング言語でした。その頃の名称は、Live Scriptというものでした。ちなみに名前が似ている「Java」という言語がありますが、全くの別物です。Live Scriptが開発された当初、人気のあった言語が「Java」でした。
そのことを理由に、Live scriptからJavascriptに名称が変更となります。2016年の調査によると、最も人気のある言語にJavascriptが選出されています。ソース:Stack Overflow
人気があるってことは需要もあるってことですから、学ぶ価値はありそうですね
Javascriptが人気の理由は、テキストエディタとブラウザさえあればどこでも開発できてしまうからです。Javascriptは、汎用性が高く、手軽に楽しめるプログラミング言語ですよ
Javascriptでできること5選
で、結局Javascriptが使えるとどんなことができるようになるの？
いろいろありますが、代表的なものを5つ紹介しましょう
- Webページに動きを与える
- 入力フォームの内容チェック
- ゲームが作れる
- 拡張機能が作れる
- 非同期通信ができる
Javascriptでできること①：Webページに動きを与える
Webページに動きを与えることは、Javascriptが最も得意とすることです。
WEBページに動きを与えるってどういうことですか？
んー これは具体例を出したほうがわかりやすいでしょうね
たとえば、あるサイトでスライダーのように画面が流れていくようなものは、Javascriptによって設計されています。また、カーソルを合わせると画像が大きくなるようなポップアップも、Javascriptのおかげです。逆に動きがないページはユーザーの離脱率を上げてしまいます。Javascriptはユーザーに飽きさせない動的なサイトを簡単に設計できるのです。
たしかに、サイトが動いていると楽しそうな印象はありますよね
わかるー
Javascriptでできること②：入力フォームの内容チェック
Webアプリやサービスには、新規登録やログインといった機能が欠かせません。
ログインや新規登録の機能はサーバーサイドの言語によって成り立っています。Javascriptは入力した内容が合っているか違っているかをユーザーに伝える役割があります
メールアドレスに「＠」がないと警告された経験がある人も多いのではないでしょうか。警告は、Javascriptがバックエンドの言語にデータを渡す前に、事前にチェックをしている証です。Javascriptとサーバーサイド言語での二重のチェックにより、より安全なサイト設計ができます。
こういった裏方の仕事もJavascriptはやっているんですね
Javascriptでできること③：ゲームが作れる
実は、Javascriptはゲームを作ることもできます
おー！ それはすごい
Javascriptを使えばタイピングゲームやブロック崩しゲームなどが比較的簡単に作れます。また、RPGや、シューティングゲーム、テトリスなどといった本格的なゲームも。Javascriptにはライブラリが豊富に揃っており、手軽にゲームが作れるのです。
You TubeなどでJavascriptを使ったゲームサンプルが動画であるので、興味のある方は見てみると面白いですよ
Javascriptでできること④：拡張機能が作れる
JavascriptとHTML/CSS、jsonを組み合わせれば、GoogleChromeなどの拡張機能が作れます
Javascriptの役割としては、ブラウザ上で動作させるメニューや設定を変更するページの記述をするなどです。拡張機能は、ブラウザで動く機能のためJavascriptと相性が良いのです。
拡張機能が作れるってすごいの？
実はGoogle自体は、すごくシンプルな機能しかないんですよ。でも、拡張機能を持たせることでいろいろなことが便利にできるようになります。何をどこまで便利にするのかは拡張機能次第ですが、Javascriptを使えば可能性は大きく広がります
Javascriptでできること⑤：非同期通信ができる
非同期通信とは「リアルタイムで通信できる」技術のことです。
これ、よくわからないですね……
Webページを表示する時には、ブラウザ側とサーバー側でのやり取りが行われます。そのため、ページ表示速度が遅くなってしまうのです。非同期通信はサーバーとの掛け合いがないため、リアルタイムでページが更新されていきます
Google Mapなどは非同期通信を採用しているため、カーソルを動かした分だけ瞬時に読み込みページに反映させているのです。
Javascriptができない（苦手なこと）2選
なんかいいことばかりいってるけど、どうせダメな部分もあるんでしょ？
まぁ、なくはないですね。では、Javascriptが苦手なことも2つお伝えしましょうか
- ブラウザごとに動作が違う
- 読み込みが遅い
Javascriptが苦手なこと①：ブラウザごとに動作が違う
Javascriptはブラウザで動くため、「Safari」「Microsoft Edge」「GoogleChrome」などのブラウザで挙動が違う場合もあります。あるブラウザでは、キレイに動作していても、別のブラウザでは動かないなんてことも珍しくありません。
そのため、主要なブラウザで挙動がきちんとされているかを確かめる必要があります。開発者にとっては、結構な負担になる作業です。
これめんどくさいじゃん
たしかに、開発者にとっては面倒な部分の1つですね
Javascriptが苦手なこと②：読み込みが遅い
Javascriptはページの読み込み速度が遅いです。
ブラウザによって表示速度が違うため、製作者側でテストする必要があります。現代人は忙しいので、少しでも読み込みが遅いと離脱してしまう可能性もありますね。
ページの読み込み速度って、そこまで大事なんですか？
SEOを意識するのであれば大事なのですが……プログラミング初心者がそこまで気にする類のものではないような気もしますね。ページの読み込み速度に一喜一憂する時間があるのなら、他に時間を使ったほうが良いでしょう
まとめ:Javascriptができることは思っている以上に多い
以上、Javascriptができることとできないことをメインに紹介してきました。
ちょっと駆け足でしたが、Javascriptについて紹介しましたよ
Javascriptはとても汎用性が高い言語で、使っていないサイトはないくらいメジャーです。そのため、Javascriptを扱えるエンジニアは重宝されます。
需要が高いのなら学ぶ価値はありますね
デメリットもあるようだけど、そこまで大きなデメリットには感じなかったなー
学びやすいやすい言語ということもあり、HTMLとCSSを学び終えたらJavascriptを学ぶ人も多いようです。どのプログラミング言語を学ぶか迷っている方は、選択肢の1つにするといいかもしれませんね