初心者向けJavaScriptとjQueryの違いと学習する順番

暖かくなってきて暁を覚えない黒い巨匠です。
前回記事ではそれぞれの言語がwebサイトで持つ役割について説明致しました。

今回はJSを学習していても気づいたらjQueryのサイトを見ていた、なんてことが多そうなscript初心者向けにJavaScriptとjQueryってなんなのよ？って所を解説したいと思います。

私は論理的思考が苦手で解説本とか読んでも全く頭に入らず、逆に混乱することもあったくらいのポンコツなので、この記事を読んでいる段階の方には不必要と思われる解説は省きます。経験者の方には物足りない内容かと思いますがよろしくお願いします。

JavaScriptとは

前回記事の復習、学習したてのころは混同しがちですが名前が似ているだけでJavaとJavaScriptは全く別の言語です。JavaScriptを略すときはJSと略しましょう。

• webページ
• アプリ…（Twitter,LINE等）
• ゲーム…（スマホゲーム、ブラウザゲーム等）

などなど
JavaScriptは幅広い場所で活躍しており、PC/スマホを持っている人なら一日に何度も触れています。また、IoTやAIのような最新IT技術にも活用されています。
つまり、需要も高く極めれば高収入が見込めます。（2021年現在）

JavaScript(JS)の特徴

• JavaScriptはクライアントサイド・サーバーサイドどちらでも処理が行える言語であることから汎用性が高い。
• メモ帳（テキストエディタ）とブラウザだけで始められる為特別な環境構築が必要なく気軽に始められる。※とはいえデフォルトのメモ帳はプログラミングには非推奨です…。
• 規模の大きいプログラミングを行う際、オブジェクト指向の理解が必要。（今回は割愛、興味のある方は調べてみてね）

jQuery（jQ）とは

JavaScriptのライブラリという親子のような関係だが全く別の文法であると知っておきましょう。
JavaScriptライブラリを先に読み込む事により、JavaScriptを少ない記述で実現できる、扱いやすくした言語。色々と対応が面倒なInternetExplorer(IE)にもお手軽にスクリプトを反映できるのが強み。
プログラミングが苦手な人でもHTML/CSSさえ覚えればCSSに近い感覚で扱うことができる。

ライブラリを読み込む方法は２つ

• DLしてローカルで読み込む（jQuery公式）
• CDNのURLを読み込む（jQuery CDN公式）

多少のデメリットはありますがDL/CDNお好きな方を選んで下さい。

「jQuery Core 3.3.1」「jQuery Core 1.12.4」等のファイル名はバージョンを表しており、対応ブラウザとメソッドが微妙に違います。古いブラウザにも対応させたい場合はCore１から、最新版で作りたい場合はCore３から始まるファイルを選んでおけばOK。
ファイル名に「min」と付いているものは軽量版です、理由がない場合「min」を選んでおけばOK。

<!-- jQを先に読み込み、自分で記述したファイルは後に読み込む事 -->
<!-- DLの場合 -->
<script type="text/javascript" src="格納場所/jQファイル名.js"></script>
<!-- CDNの場合 -->
<script type="text/javascript" src="https://CDNURL"></script>
<!-- jQueryを記述したファイル -->
<script type="text/javascript" src="格納場所/ファイル名.js"></script>

CDN（コンテンツデリバリーネットワーク）とは

ファイル（コンテンツ）をユーザーに配信する仕組み、アクセス元から近いサーバに通信をとって高速化を実現している。
当然ネットに繋がっていないと利用できないので開発環境で未接続の方は注意。

JavaScriptとjQueryどっちから学べばいいの？

デザイナーか開発か、目的があるならば単純です。

デザイナーはjQueryでもok

jQueryを扱えるようになってからJavaScriptを始めてもいいです。
なぜなら、デザイナーは開発に携わらないのでCSSのようなイメージでスクリプトを使えるjQueryで充分だからです。開発のスキルに注力する前にadobeXD等のツールを習得しましょう。

しかし、jQueryの学習は将来性に難点があります。
jQueryは普及率が高く2021年現在でも需要がありますが、jQueryはInternetExplorer(IE)に対応できるのが最大の強みであり、IEが廃れると共に需要がなくなる可能性が高いので堅実に学んでいきたい方はJavaScriptがおすすめ。

デザイナーさんでも最終的にはJavaScriptもjQueryも「できているものを編集できる」程度には理解しておくと開発（コーダー）とのコミュニケーションがとりやすくなるのでおすすめです。

開発はJavaScriptから学ぼう

開発やフロントエンジニアを目指す人はJavaScript一択です。

web業界完全未経験で、JavaScriptに苦手意識がある方はjQueryを軽く触ってからでもいいかな、とも個人的には思いますが、jQの親であるJavaScriptの方が常に需要があり将来性があることは理解しておきましょう。

JavaScriptをしっかり習得したらvue.js やNode.jsなど、その時に需要が高いライブラリやフレームワークの学習に進むとエンジニアとしての価値が上がっていきます。

最後に

変数とか引数とかifとかforとかギギギギギ…となりますが右も左もわからないまま、何か一つでも簡単なプログラムを作ってみるのがオススメです。
一度作って改修したり、バグを起こした時があなたのステップアップチャンス！なのです。
怯えずめんどくさがらずレッツトライ！なのです。