【初心者向け】JavaScriptってどんな言語？何ができる？

はじめに

JavaScriptは、動的なWebサイト制作には欠かせないプログラミング言語です。
本記事では、JavaScriptとは何か、Webサイト構築において何ができるのか具体的な事例を交えてご紹介します。

スポンサードサーチ

JavaScriptってどんな言語？

JavaScriptはブラウザ上で動作するプログラミング言語として1995年に登場しました。
現在のWebページの多くは、文章構造を作るHTMLと、見た目を装飾するCSS、そしてそれらを操作するJavaScriptで構成されています。
「ボタンを押すとメニューが表示される」機能や、Google MapsやFacebookなどの画面上で様々な操作ができるアプリケーションの様な機能もJavaScriptで実現されています。

JavaScriptを学ぶことでWebでできることの幅がグーンと広がります。

JavaScriptで何ができる？

では早速、JavaScriptでできることを具体的に紹介いたします。

HTML/CSSの追加・書き換え

JavaScriptを使うとWebページで表示するHTMLコンテンツとスタイルを変更する事ができます。
例えば、下記の様に、サンプルのボタンをクリックすると表示されているテキストと色が変わる機能があります。

テキストが変わります。

クリックしてください！

イベント処理

JavaScriptを使用することで、ユーザーの行動に応じてWebページに動きを加えることができます。
上で紹介したHTML書き換えボタンも「クリック」という行動に応じて「テキストが変わる」という動きを加えております。

他にもマウスオーバー、Webページそのものロード時など、その他様々なタイミングで処理を行わせることができます。

非同期通信（Ajax）

Ajaxとは「Asynchronous JavaScript + XML」の略語です。
従来のWebアプリケーションでは、処理を行うたびにWebページの読み込みが必要で、軽快に動作させることが困難でした。

しかし、Ajaxを用いることで、Webページ全体の再読み込みを行うことなくサーバーと通信し、その結果を画面に反映させることができます。

Ajaxを使用した有名な例はGoogle MapsやGoogle検索やAmazonのサジェスト機能などがあります。

スポンサードサーチ

JavaScriptで作れるもの

Webサイト制作において、JavaScriptで作れる機能には、以下の様なものがあります。

動きのあるメニュー

クリックしたらスムーズにリストが開閉するメニューです。

スマートフォンに実装すると良いメニューです。

カッコイイメニューも実装可能です。

スライダー

下記の様な複数の画像を次々と表示させるスライダーも、JavaScriptで実現しています。

モーダルウインドウ

画面の上に覆いかぶさる様に表示されるモーダルウインドウです。

なぜJavaScriptを学ぶのか

ここまでJavaScriptでできることや作れるものについて概要を紹介しました。JavaScriptは、本記事で解説したこと以外にも様々なことができるプログラミング言語で、非常に汎用性が高いので、身につければできることの幅が非常に広がります。

また、比較的とっつきやすい言語でもあり、Webフロント開発において需要の高い言語でもあります。

次回以降の記事で、実際にJavaScriptの作り方について解説していきます。知識ゼロからでもこわがらず、プログラミングを学んでいきましょう！