Javascriptでできること、できないことを初心者向けにまとめてみた

女性 モバイル 言語・WordPress

今日も牛山くんと猫田さんは雑談です。

牛山くん
牛山くん

HTMLとCSSもなかなか奥が深いですね。これらが終わったら、いよいよ本格的なプログラミング学習に入るわけですが……どの言語を最初に学ぶか、猫田さんは決めました?

猫田さん
猫田さん

んんー イマイチよくわかっていないんだよねー

牛山くん
牛山くん

やっぱりそうですか。実は、僕もどのプログラミング言語を学ぼうか、決めかねているんですよ

二人がそんな話をしているとキャニット先生がやってきました。

CANIT先生
CANIT先生

二人の話が聞こえてきましたよ。HTMLとCSSが終わったら、Javascriptを最初に学ぶ人が多いみたいですよ

牛山くん
牛山くん

Javascript……名前はよく聞きますね

猫田さん
猫田さん

Javascriptの名前はよく聞くけど、具体的に何ができるようになるのかよくわからないのよね

CANIT先生
CANIT先生

なるほど。たしかに今までJavascriptの詳しい説明はしてこなかったかもしれませんね。せっかくなので、今回はJavascriptについて詳しく紹介しましょうか。Javascriptを学べばどのようなことができるようになるのか、お話ししましょう

というわけで、今回はプログラミング初心者に向けてJavascriptの紹介をします。

Javascriptとは何か 

パソコン

Javascriptは、Web上のページに動きを与えることが主な役割のプログラミング言語です。

開発されたのは1990年代はじめで、最初はNetscape Navigatorというブラウザ専用のプログラミング言語でした。その頃の名称は、Live Scriptというものでした。ちなみに名前が似ている「Java」という言語がありますが、全くの別物です。Live Scriptが開発された当初、人気のあった言語が「Java」でした。

そのことを理由に、Live scriptからJavascriptに名称が変更となります。2016年の調査によると、最も人気のある言語にJavascriptが選出されています。ソース:Stack Overflow

牛山くん
牛山くん

人気があるってことは需要もあるってことですから、学ぶ価値はありそうですね

CANIT先生
CANIT先生

Javascriptが人気の理由は、テキストエディタとブラウザさえあればどこでも開発できてしまうからです。Javascriptは、汎用性が高く、手軽に楽しめるプログラミング言語ですよ

Javascriptでできること5選

猫田さん
猫田さん

で、結局Javascriptが使えるとどんなことができるようになるの?

CANIT先生
CANIT先生

いろいろありますが、代表的なものを5つ紹介しましょう

  • Webページに動きを与える
  • 入力フォームの内容チェック
  • ゲームが作れる
  • 拡張機能が作れる
  • 非同期通信ができる
 

Javascriptでできること①:Webページに動きを与える 

スマホ

Webページに動きを与えることは、Javascriptが最も得意とすることです。

牛山くん
牛山くん

WEBページに動きを与えるってどういうことですか?

CANIT先生
CANIT先生

んー これは具体例を出したほうがわかりやすいでしょうね

たとえば、あるサイトでスライダーのように画面が流れていくようなものは、Javascriptによって設計されています。また、カーソルを合わせると画像が大きくなるようなポップアップも、Javascriptのおかげです。逆に動きがないページはユーザーの離脱率を上げてしまいます。Javascriptはユーザーに飽きさせない動的なサイトを簡単に設計できるのです。

牛山くん
牛山くん

たしかに、サイトが動いていると楽しそうな印象はありますよね

猫田さん
猫田さん

わかるー

Javascriptでできること②:入力フォームの内容チェック 

Webアプリやサービスには、新規登録やログインといった機能が欠かせません。

CANIT先生
CANIT先生

ログインや新規登録の機能はサーバーサイドの言語によって成り立っています。Javascriptは入力した内容が合っているか違っているかをユーザーに伝える役割があります

メールアドレスに「@」がないと警告された経験がある人も多いのではないでしょうか。警告は、Javascriptがバックエンドの言語にデータを渡す前に、事前にチェックをしている証です。Javascriptとサーバーサイド言語での二重のチェックにより、より安全なサイト設計ができます。

牛山くん
牛山くん

こういった裏方の仕事もJavascriptはやっているんですね

Javascriptでできること③:ゲームが作れる 

ゲーム
CANIT先生
CANIT先生

実は、Javascriptはゲームを作ることもできます

猫田さん
猫田さん

おー! それはすごい

Javascriptを使えばタイピングゲームやブロック崩しゲームなどが比較的簡単に作れます。また、RPGや、シューティングゲーム、テトリスなどといった本格的なゲームも。Javascriptにはライブラリが豊富に揃っており、手軽にゲームが作れるのです。

CANIT先生
CANIT先生

You TubeなどでJavascriptを使ったゲームサンプルが動画であるので、興味のある方は見てみると面白いですよ

Javascriptでできること④:拡張機能が作れる

CANIT先生
CANIT先生

JavascriptとHTML/CSS、jsonを組み合わせれば、GoogleChromeなどの拡張機能が作れます

Javascriptの役割としては、ブラウザ上で動作させるメニューや設定を変更するページの記述をするなどです。拡張機能は、ブラウザで動く機能のためJavascriptと相性が良いのです。

猫田さん
猫田さん

拡張機能が作れるってすごいの?

CANIT先生
CANIT先生

実はGoogle自体は、すごくシンプルな機能しかないんですよ。でも、拡張機能を持たせることでいろいろなことが便利にできるようになります。何をどこまで便利にするのかは拡張機能次第ですが、Javascriptを使えば可能性は大きく広がります

Javascriptでできること⑤:非同期通信ができる 

非同期通信とは「リアルタイムで通信できる」技術のことです。

牛山くん
牛山くん

これ、よくわからないですね……

CANIT先生
CANIT先生

Webページを表示する時には、ブラウザ側とサーバー側でのやり取りが行われます。そのため、ページ表示速度が遅くなってしまうのです。非同期通信はサーバーとの掛け合いがないため、リアルタイムでページが更新されていきます

Google Mapなどは非同期通信を採用しているため、カーソルを動かした分だけ瞬時に読み込みページに反映させているのです。

Javascriptができない(苦手なこと)2選 

パソコン 少女
猫田さん
猫田さん

なんかいいことばかりいってるけど、どうせダメな部分もあるんでしょ?

CANIT先生
CANIT先生

まぁ、なくはないですね。では、Javascriptが苦手なことも2つお伝えしましょうか

  • ブラウザごとに動作が違う
  • 読み込みが遅い
 

Javascriptが苦手なこと①:ブラウザごとに動作が違う

Javascriptはブラウザで動くため、「Safari」「Microsoft Edge」「GoogleChrome」などのブラウザで挙動が違う場合もあります。あるブラウザでは、キレイに動作していても、別のブラウザでは動かないなんてことも珍しくありません

そのため、主要なブラウザで挙動がきちんとされているかを確かめる必要があります。開発者にとっては、結構な負担になる作業です。

猫田さん
猫田さん

これめんどくさいじゃん

CANIT先生
CANIT先生

たしかに、開発者にとっては面倒な部分の1つですね

Javascriptが苦手なこと②:読み込みが遅い

Javascriptはページの読み込み速度が遅いです。

ブラウザによって表示速度が違うため、製作者側でテストする必要があります。現代人は忙しいので、少しでも読み込みが遅いと離脱してしまう可能性もありますね。

牛山くん
牛山くん

ページの読み込み速度って、そこまで大事なんですか?

CANIT先生
CANIT先生

SEOを意識するのであれば大事なのですが……プログラミング初心者がそこまで気にする類のものではないような気もしますね。ページの読み込み速度に一喜一憂する時間があるのなら、他に時間を使ったほうが良いでしょう

まとめ:Javascriptができることは思っている以上に多い

以上、Javascriptができることとできないことをメインに紹介してきました。

CANIT先生
CANIT先生

ちょっと駆け足でしたが、Javascriptについて紹介しましたよ

Javascriptはとても汎用性が高い言語で、使っていないサイトはないくらいメジャーです。そのため、Javascriptを扱えるエンジニアは重宝されます。

牛山くん
牛山くん

需要が高いのなら学ぶ価値はありますね

猫田さん
猫田さん

デメリットもあるようだけど、そこまで大きなデメリットには感じなかったなー

CANIT先生
CANIT先生

学びやすいやすい言語ということもあり、HTMLとCSSを学び終えたらJavascriptを学ぶ人も多いようです。どのプログラミング言語を学ぶか迷っている方は、選択肢の1つにするといいかもしれませんね


挫折率が高い??プログラミング学習のポイント
駆け出しエンジニアが一緒に学ぶ
CANITは、Progateやドットインストールで独学している人達同士をつなげます。駆け出しエンジニアのあなたのためのSNSです。
言語・WordPress
【この記事を書いた人】
CANIT 先生

あらゆるプログラミング言語をあやつるフリーの凄腕講師。温和な性格で「わかるまで教えます」がモットー。たまに時間ができると動物の仲間達に、プログラミングを教えることもある。現在の生徒は牛山くんと猫田さん。

CANIT
タイトルとURLをコピーしました