【JavaScript】学習前にJavaScriptのことを知ろう!JavaScriptで何ができる?メリットは?

JavaScript(ジャバスクリプト)は、主にブラウザ(ChromeやSafariなど)で実行するためのプログラミング言語です。

他のプログラミング言語(Java、Python、Ruby、PHPなど)と同じくサーバー上でも実行することができますが、一番の違いはJavaScriptがブラウザで実行できる言語だという点です。

数年前まではjQuery(ジェイクエリー)というJavaScriptを簡単に扱うためのライブラリが多くの場面で使用されていました。
しかし、生のJavaScriptが強力に成長したこともあり、現在ではjQueryよりもそのままのJavaScriptを使用する機会が増えてきています。

React(リアクト)やVue.js(ビュージェイエス)などのJavaScriptフレームワークが近年Web開発で使用されることが多くなり、JavaScriptは今最も注目されているプログラミング言語となっています。

JavaScriptで何ができるか

フロントエンドの言語の役割の例

Webページでは、HTMLは骨格の役割をし、CSSはレイアウトやデザインの装飾、JavaScriptはそれらを動かすことに使用されます。

JavaScriptで何ができるかについて代表的なものを紹介します。

HTMLCSSを操作できる

JavaScriptを使ってHTMLやCSSを様々なタイミングで操作することができます。

この操作は関数というプログラムの処理をまとめたものに定義されており、任意のタイミングで呼び出して使用します。

次の例は、画面が読み込まれたタイミングで、タイピング風にHTMLを操作するJavaScriptの関数を実行しています。

次の例では、ユーザーがボタンを押したタイミングで答え合わせを行うJavaScriptの関数を実行しています。

JavaScriptを使用すれば、任意のタイミングで画面を更新することができるようになり、ユーザーとの対話が可能なWebサイトを構築することができます。

外部のサーバーと通信ができる

フロントエンドとバックエンドについての画像

JavaScriptを使用して外部のサーバーに通信し、データの取得や保存を行うことができます。

取得したデータを画面に表示すれば検索機能を実装することができ、
また、外部のデータベースにデータを保存するように通信して、誰でも閲覧できる記事やコメントを保存することができます。(外部のサーバーには検索機能や保存機能をもつバックエンドアプリケーションを構築する必要があります。)

JavaScriptは、通信をブラウザ内部で行うことができるため、いいねボタンやチャットの投稿のような画面全体の更新処理が不要な場合においては必要不可欠なものとなっています。

アプリを作成できる

FacebookやInstagramのモバイルアプリは、JavaScriptで制作したアプリケーションをAndroidやiPhoneで動作可能なコードに変換するReact Nativeが使用されています。

本来、AndroidならJavaかKotlin、iOSならSwiftなど、それぞれ別の言語を使用するする必要がありますが、React Nativeはフロントエンド言語のみで両方のアプリを構築できます。

また、モバイルアプリだけではなく、ブラウザで動作するWebアプリを制作することができます。
これまでモバイルアプリでしか実現できなかった機能(オフライン対応やプッシュ通知など)もWebアプリで実現可能になってきています。

理解度チェック

  • JavaScriptでできることを3つ挙げて他の人に説明してみましょう。

JavaScriptを学習するメリット

初心者に優しい

JavaScriptは、ブラウザがあれば実行することができるため、学習環境が簡単に整います。
これは、初めてプログラミングを学習する方にとっては大きいメリットです。

また、他の言語と比較して文法やコードの実行結果に差があることはありますが、学習の観点からはプログラミング言語として大きな違いはありません。

JavaScriptでプログラミングが理解できれば、他の言語の習得も容易に理解できるはずです。

フロントエンドでもバックエンドでも使える

他の言語との一番の違いは、JavaScriptがブラウザで実行できる点です。

外部のサーバーで動作するバックエンドのアプリケーションの構築はJava、Python、Ruby、PHPなど複数の言語から選択することができますが、ブラウザで動作する言語は多くの場合JavaScriptを選択することになります。

さらに、Node.jsやDenoを使用すればバックエンドで動作するアプリケーションまでJavaScriptで構築することができます。

無料で公開できる外部サーバーがある

インターネット上に制作したWebサイトを公開するためには、誰でもアクセスできる外部サーバーが必要です。

この外部サーバーは、自分で用意するにしてもレンタルするにしてもお金が必要です。

しかし、JavaScriptを使用して制作されたWebアプリは、無料で公開できるサービスが複数あります。
新しいサービスを公開して試してもらいたい場合や、自分のポートフォリオを制作して公開する場合には嬉しいですね。

理解度チェック

  • JavaScriptは何があれば実行できますか?

前のレッスン
次のレッスン

Twitterでアウトプット

理解したことや分からないところはTwitterでつぶやいてみよう!

この学習ページで学んだことをTwitterでアウトプットしてください。

アウトプットするメリット

学習仲間が増える

同じ課題を持った仲間が増えるため、学習へのモチベーションが継続しやすくなります。

より深く理解する

頭では理解したと思っていても、文章化することで初めて気づくことがあります。