jQueryを学ぶ上でよく出てくる言葉とその仕組み

まずjQueryとはオープンソースのJavaScriptライブラリのことです。オープンソースとはソフトウェアソースコードの改良や再配布を誰もが行うことを許可された無償のもので、jQueryではGPLとMITライセンスの下で配布されています。ライブラリとは別のプログラムから呼び出して使えるように、汎用性の高いプログラムをいくつかにまとめて一つのファイルにしたものを言います。

DOM

DOMとは、HTML文書とXML文書において、文書の論理的構造や、文書へのアクセスや操作の方法を定義するものです。(「Document Object Model」の略称。)つまり、jQueryではHTMLなどに使われる構造化されたタグに挟まれた要素を使って位置を特定し、文章などの内容を書き換えたりする手段であり、この仕組みによってウェブサイトを素早く処理することが可能になります。また、DOMはAPI仕様のため、他のプログラミング言語に依存しません。このためJavaScriptだけでなく、PHPやJavaでもドキュメント操作が可能です。

DOMツリーとノード

DOMツリーは、オブジェクトのツリー状の集合のことで、各オブジェクトはノードと呼ばれています。特定のノードから他のノードを参照する場合には、親ノードや子ノードなどと呼称されます。また、ここで言うオブジェクトはxmlやhtmlの各要素(エレメント)を指していて、<div>や<a>などが該当します。尚、JavaScriptでは、ページの読み込みと共にDOMオブジェクトを自動的に認識します。まずhtmlページの最上位であるhtmlをdocumentオブジェクトとし、その下に各要素をオブジェクトとして構築していくといった感じです。

jQueryオブジェクトとメソッドチェーン

一般にプログラムでいうオブジェクトは、操作できるデータのことです。jQueryでは、DOM要素やCSSのデータプロパティ、処理手段であるメソッドをセットにしたものをオブジェクトと言います。また、jQueryは、jQueryという一つのオブジェクトから派生し、多くの場合、メソッドが戻り値として返すjQueryオブジェクトが更に別のメソッドを呼び出すといった連続的な処理を行います。これがメソッドチェーンと呼ばれるやり方です。そして、jQueryは必ずjQueryオブジェクトが起点になります。

jQueryの短縮

jQueryにはよく「$」という記述が出てきますが、これは本来「jQuery」と記入すべきところを「$」と短縮して記入しているものです。メソッドチェーンなどでその都度「jQuery.・・」と記入するには非効率であるため、こういう書き方があるという訳です。また、jQueryの決まり事である「$(document).ready(function(){・・・});」は、「$(function(){・・・});」と短縮して記入することが出来ます。しかし「$」は他のJavaScriptライブラリでも使われることが多いため、併用していて衝突する場合は、jQueryスクリプトの先頭に「jQuery.noConflict();」と記入するか、「var JQ = jQuery.noConflict();」などとして「$」そのものを「JQ」などに変更するといった方法で対処します。尚、「$(function(){処理・・・}」は、ページ読み込み終了及びDOMの構築が終わったところでfunction()内の処理を実行するという意味です。

メソッドとプロパティ

メソッドとは「.click()や.removeClass()」などの部分です。つまり、「ドットの右側から()」までの部分を指していて、オブジェクトに関連付けされた関数のことを言います。プロパティはオブジェクトが保有するデータのことを言います。

コールバック関数

コールバック関数とは、ある関数が実行されている最中に実行されるように前もって用意された関数であり、別の関数に引数として渡される関数のことを言います。その結果、コールバック関数に実行制御が渡ります。

クロージャ

内側の関数はそれを内包する外側の親関数内でのみ利用できます。内側の関数がローカル変数を持っていなくても外側の親関数内でローカル変数が宣言されている場合、内側の関数は親関数のそのローカル変数を使うことができます。この、プログラム内で環境を共有するための仕組み、或いはその内側の関数がクロージャと呼ばれているものの正体です。

クロージャは関数であるのに、名前を持たないことが多いのですが、これはクロージャを使うとグローバル変数の使用回数が減り、プログラム中での名前衝突が起こりにくくなるためです。また、たった一度しか使わない使い捨てとも言えるような関数にわざわざ名前をつけるのも非効率的と言えるでしょう。特にjQueryでよく使われるコールバック関数では、こういった使い捨ての関数が多用される傾向にあり、そこでより簡潔に記述するためにクロージャが利用される訳です。