「どっちが先?」JavaScriptとjQueryの違いと学ぶ順番(初心者向け)

JavaScript、jQueryどっちが先?

Webエンジニアを目指しているプログラム初心者から、次のような質問を受けました。

相談者「Webエンジニアを目指しています。HTMLとCSSは一通り学びました。」

相談者「次は動きのあるサイトを作りたいのですが、 JavaScriptとjQueryのどちらを先にやった方がいいですか?」

私「結論から言うと、jQueryを先にやるのがおすすめですけど。 ちなみに、JavaScriptとjQueryの違いは把握してますか?」

相談者「いえ、よくわかってないです。違いも教えてください」

今回はこの相談を解決するために、 「どっちを先に学習した方がいいのか」と、 「JavaScriptとjQueryの違い」について説明します。

結論:まずはjQueryから学習しよう

もしあなたが今回の相談者と同じように、 「HTML・CSSの次はJavaScriptとjQueryのどちらを先にやればいいの?」 と思っているのなら、「jQeury」から入ることをお勧めします。

理由はJavaScriptよりもjQueryの方が習得しやすいし、おもしろいからです。

JavaScriptというのは範囲が広くて、奥が深い言語です。 JavaScriptから入ると、挫折する可能性が高くなります。

まずはハードルを下げて、プログラミング楽しむためにはjQueryが最適です。

では次に、JavaScriptとjQeuryの違いについて説明します。

JavaScriptとjQeuryの違い

JavaScriptとjQueryの違いを知るためには、 まずJavaScriptが大きく3つに分類されることを知っておく必要があります。

JavaScriptの3分類

JavaScriptの3分類

JavaScriptは大きく分けて次の3つに分類されます。

コアJavaScript
文字通り「核」となる部分。 変数、配列、オブジェクト、if文、ループ文などの文法・記法といった JavaScriptのベースとなる部分。
クライアントサイドJavaScript
平たく言えばブラウザを操作する部分。「DOM」操作とも言う。 動きのあるホームページを作るのに必要な機能であり、JavaScriptの花形とも言えます。
サーバーサイトJavaScript
PHPなどのサーバーサイド言語と同じような働きをします。 Webエンジニアを目指している人は、初心者の段階でここに手を出す必要はありません。

jQueryの位置づけ

たまにjQeuryがプログラム言語だと思っている人がいるので整理しておきます。

  • JavaScript --- プログラム言語
  • jQeury --- JavaScriptライブラリ

jQueryは「JavaScriptライブラリ」の一つです。 ライブラリというのは、開発を効率化するための機能を集めたものです。

jQueryというプログラム言語があるのではなく、 JavaScriptというプログラム言語での開発を、効率化するためのライブラリの一つがjQueryです。

もう少し具体的に言うと、 jQueryは、主に「クライアントサイドJavaScript」部分の開発を効率化するためのライブラリです。

下図のような位置づけになります。

jQeuryの位置づけ

jQeuryがカバーするのは主に「クライアントサイドJavaScript」であって、 基本となる文法部分「コアJavaScript」はカバーしていません。

ですから実際に開発する際は、 ブラウザ操作(DOM操作)の部分はjQeuryで記述し、 IF文などの「コアJavaScript」の部分はJavaScriptのルールに基づいて記述します。

つまり、「コアJavaScript」+「jQuery」の知識が必要となります。

「コアJavaScript」は浅くていい

実際の開発では「コアJavaScript」+「jQuery」の知識が必要と先程書きました。

ですが、「コアJavaScript」は奥が深いです。 初心者の段階でここに深入りすると、挫折する可能性が高くなります。

最初の段階は「コアJavaScript」を深く知らなくても大丈夫です。 基本部分だけを浅く抑えましょう。

「コアJavaScript」+「jQuery」を学習する方法

一番手っ取り早くておすすめできるのは書籍で学習することです。

jQueryの入門書ならjQueryだけでなく、 基本的なJavaScriptの文法も解説しています。 つまり、「コアJavaScript」を浅く+「jQuery」が学べます。

おすすめ本は何冊かあるのですが、一番のおすすめは次の本です。

jQuery標準デザイン講座
Amazonのレビューを見る

サンプルの数が豊富で、サンプル作成を通して、 初心者が徐々にレベルアップできるような構成になっています。

本の厚さも入門書としてはちょうど良い程度です。約300ページ。

もう一冊は次の本です。

jQuery最高の教科書
Amazonのレビューを見る

最初の本よりも分厚いです。教科書的な本を求めているならこちらの方がいいかもしれません。

どちらもJavaScriptの基本的な文法解説があり、 jQueryの入門書としておすすめできます。 販売ページで目次やレビューを見て自分に合いそうな本を選んでください。