2022/12/10

【初心者向け】jQueryは何に使う？よく利用する場面3選

jQueryはJavaScriptの古参ライブラリですが、現在では後発のReact等に気圧され、徐々に使用される場面が減っています。

しかし、需要は減っている中でも、適材適所で運用すればまだまだ便利なライブラリなのは確かです。

そこで今回は、初心者の方などに向けて、jQueryがよく利用されている場面（適している場面）を3つご紹介します。

（jQueryについてよく知らない方は、以下の記事にjQueryの特徴などをまとめているので、先に読んでおくことをおすすめします。）
jQueryは時代遅れ？

1．高度なアニメーションの実装

JavaScriptは、canvasやDOM操作を用いた高度なアニメーションに対応しているのが特徴であり、そんなJavaScriptのプログラムを簡潔に書けるjQueryは、必然的に高度なアニメーションを実装する場面でよく利用されます。

jQueryはcanvas向けのライブラリでは無いため、基本はDOM操作を応用したアニメーション実装が出番です。

三角関数などの座標計算をするのはどうしてもcanvasの方が有利なので、滑らかなアニメーションなどを実装する場合にjQueryはあまり向いていません。

従って、jQueryを用いる場合は、CSSのkeyframe機能で実装するようなアニメーションを、各要素を用いて実現することになります。

有名どころで言うと、Material Design Hierarchical DisplayというjQueryプラグインは、jQueryで高度なアニメーションの実装を実現している良い例です。参考にしてみてください。

今でこそJavaScript関連の技術はReactやVue.jsが有名になっていますが、それらの技術はあくまで後発のもので、2010年頃にはjQueryがJavaScriptの中でもトップクラスのシェアを誇っていました。

そのため、その時代に作られていたほぼ全てのWebサイトにjQueryが活用されているのです。

当然ながら、古いWebサイトをそのままの状態で動くように保守するような業務も多く、俗に言うレガシーな保守案件では、未だにjQueryの技術がトレンドの大定番ライブラリになっています。

レガシーなWEBサイトの保守・運用では、まだまだjQueryが継続的に使われていくでしょう。

一応、古くなったWEBサイトはセキュリティ上のリスクなどがあり、jQueryからReactやVue.jsなどでWEBサイトを構成するようなリプレース案件が出てきています。

ただし、jQueryは非常にポピュラーなライブラリなので、そもそも新規にWEBサイトを作成する場合に利用されるケースも多いです。

既存サイトのリプレースが進んでいったとしても、jQueryは手軽に扱えるライブラリという強みがあるため、ホームページやランディングページの制作では依然として主力になるかもしれません。

（ただ、jQueryは更新が停滞気味で徐々に開発ペースが落ちているため、将来性はあまり期待しない方が良いでしょう。）

jQueryの中でも便利な機能として、Ajax通信の簡易実装が挙げられます。

Ajax通信とは、JavaScriptを用いてWEBページとサーバで非同期通信を行うというものです。

要するに、スマートな通信処理を実現できる機能と言えます。

標準のJavaScriptライブラリでも実装することは可能ですが、目的の処理を実装しようと思うと、様々なステータスを記憶して書き込む必要があり、非常に面倒です。

jQueryの関数を使えば、そういった煩わしいコードを書く必要が無くなり、実装したい処理を簡単に実現することができます。

ここでは詳しく書きませんが、以下の非公式リファレンスで仕様が掲載されているため、気になる方は詳しく読んでみてください。

jQueryは比較的古参のライブラリで、ReactやVueの流行などから使用機会は少しずつ減少しています。

しかし、依然としてアニメーション実装な非同期通信の実装など、WEB制作の現場では高い利用率を誇るのも事実です。

jQueryを勉強する場合は、自分はどういった場面でJavaScriptを利用していくのかをイメージし、目的に合わせて学習を進めていくのが良いでしょう。