web制作のしおり

日々の学習をアウトプットします。

23.jQueryってなんだ? ~JavaScriptをより簡単に~

jQueryとは

JavaScriptのライブラリ1つ

JavaScriptをより簡単に記述できるようにしたもの

ということだそうです。

 

ライブラリとは

ライブラリって何でしょうか。

プログラムでよく利用される機能を切り出して、再利用しやすく纏めたものとのこと。

 

まず、ざっくりと

「ライブラリ」はプログラムを作る上で「使うもの」ということですね。

 

そして、よく利用される機能を切り出して、再利用しやすく纏めたものとのこと。

これは、身近なもので言うと

「テンプレート」とか「雛形」に似ていますね。

 

プログラム作成で使う

便利な雛形が大量に詰め込まれたファイル

という捉え方がしっくりきます。

 

ただ、文脈で「ライブラリ」が雛形1つを指している場合と、

全体を指している場合があるようです。

 

知らないカタカナは、都度調べて

どんなものかイメージしないと、

後々混乱の原因になるので注意して進めていきます。

 

 

どんなメリットがあるの?

デイトラで紹介されているメリットは3つあり、

  • 短いコードで簡単にかける
  • ブラウザごとの対応がいらない
  • 便利なライブラリがたくさんある

です。

1つずつ見ていきましょう

 

短いコードで簡単にかける

JavaScriptで20行かかるコードも

jQueryを使えば2行で済むなんてこともある

だそうな。

 

現時点で私がわかるコードで比較してみましょう。

例えば、昨日学習したDOM操作のコード(JavaScript)

 

document.getElementById('test').addEventListener('click',function(){実行させたい処理};)

 

これをjQueryを使って書き直すと

 

$('#test').click(function(){実行させたい処理})

 

これぐらいは短くなります。

積み重ねて行くと、最終的にはかなりのコード量の差になりそうですね。

 

ブラウザごとの対応がいらない

JavaScriptでは、それぞれのブラウザに対応するためのコードを記述する必要がある。

しかし、jQueryでは各ブラウザに合わせた処理を組み込み済み。

ということらしい。

と言うかJavaScriptはブラウザ毎にコードの記述が必要だったのか…。

そっちの方が勉強になりました。

 

便利なライブラリがたくさんある

え、jQuery以外のライブラリの話?と思った、そこのあなた!

私もそう思いました。

これが「ライブラリ」という言葉が、

ライブラリ全体を指しているときと、

ライブラリの中の雛形の1つを指している時がある

ということです。

 

例えば、

倉庫にコカ・コーラやファンタ、三ツ矢サイダー等の箱が

大量にストックされているところを指さして「ジュース」という場合と

1本のペットボトルを指さして「ジュース」というのでは全然違いますよね。

 

先程のライブラリもこういう事だと思います。

 

紛らわしくないように書くと、

jQueryの中には便利な雛形が沢山あるよという事ですね。

 

今日のまとめ

  • jQueryJavaScriptのライブラリ
  • ライブラリとは便利な雛形セット(もしくは雛形1つを指す場合も)
  • コードが短く、ブラウザ対応不要で、便利な雛形が沢山というメリット

 

使わないと損のような感じですね。

確かに、比較コードは随分と短くなりました。

 

jQueryJavaScriptを今後使って、0から1にすることよりも

「意味がわかる、改造できる」くらいの習熟を目指して進めていきたいと思います。

 

では、また。