機能jQuery.mapメソッドは第1引数に指定した配列の各要素を個別に第2引数のfunctionで処理します。v1.6から第1引数にobjectオブジェクトを設定できるようになりました。objectオブジェクトを設定した場合でも配列を返すことに注意してください。第2引数のfunction内でnullを返すと、その要素を削除します。jQuery.eachメソッドと似ていますが、jQuery.mapメソッドは処理した結果の配列を返す点が異なります。jQuery.eachメソッドは対象を変更せずにそのまま返します(各要素を個別に処理するだけです)。jQuery.grepメソッドと似ていますが、jQuery.grepメソッドは要素を選別するだけで、要素の値を変更することはできません。objectオブジェクトにも利用できません。配列の要素を個別に処理して配列として返すサンプル(map/01.html)を開いてbody内にbutton要素しかない確認して下さい。jQueryでは、まず以下の部分を確認してください。配列「myArray」が作成されています。"tom"];続いて以下の部分を確認してください。buttonをクリックするとjQuery.mapメソッドを利用して、配列「myArray」をfunction「mapFunc」によって処理します。これにより得られた配列は変数「ansArray」に代入します。appendメソッドを利用して配列の内容をbody要素に表示するようにしました。"<br/>");});});jQuery.mapメソッドの引数に設定するFunctionは以下の様な構文になっています。インデックス番号)を受け取ります。この引数の順番は$.eachメソッドと逆なので、紛らわしいです...これらの引数の値は{}内の処理で利用することができます。処理した要素をreturnで返すと新しく作成される配列の要素となります。このときnullを返すと、その要素は返す配列には含まれなくなります。null;}サンプルmap/01.htmlで利用したmapFuncは以下の様になっており、要素の先頭に「Mr.」を追加します。elem;};結果として、buttonをクリックすると「Mr.」が追加された要素が表示されます。第2引数のfunctionは無名関数にして直接設定することができます。elem;});nullを返して要素を削除する引数に設定するfunction内でnullを返すと、その要素は返される配列には含まれません。サンプル(map/02.html)を開いて、ほとんどmap/01.htmlと同じ事を確認してください。異なるのはmapFuncの内容で以下の様に変更され、要素が「bob」の場合はnullを返すようにしました。elem;}};結果として、buttonをクリックするとmap/01.htmlからbobを抜かした結果となります。elseの構文は三項演算子「?」を利用することで短く記述できます。elem;};objectオブジェクトのプロパティを個別処理して配列にするv1.6からjQuery.mapメソッドの第1引数にobjectオブジェクトを設定できるようになりました。返される配列であることに注意してください。サンプル(map/03.html)を開いてbody内にbutton要素しかない確認して下さい。jQueryでは、まず以下の部分を確認してください。objectオブジェクト「myObj」が作成され、3つのプロパティが設定されています。10;buttonをクリックする時の処理はほとんどmap/01.htmlと同じですが、jQuery.mapメソッドに設定されたmapFuncは以下の様に変更されています。引数で受け取ったプロパティ名「prop」を返しているだけです。prop;};結果として、buttonをクリックするとobjectオブジェクトからプロパティ名だけを抽出した配列が作成され、body内に表示されます。objectオブジェクトの場合はFunctionが受け取る引数が以下の様になり、配列とは異なります。nullを返すと、その要素は返される配列には含まれなくなるのは配列と同じです。mapメソッドを利用してください。grepメソッドを利用してください。jQuery.eachメソッドを利用してください。メモobjectオブジェクトも配列が返されることを確認サンプル(map/test01.html)を開いて、map/03.htmlと似ていることを確認して下さい。jQuery.typeメソッドを利用し、値の型を取得して表示するように変更しました。"<br/>");});結果として、myObjは「array」、ansArrayは「object」と表示され、変化してしまっていることが確認できます。objectオブジェクトはobjectオブジェクトを返してくれれば良いのに、とも思うのですが...。元のデータは変更しませんこれまで確認してきたように変更したデータは返値として返しますが、元のデータは変更しません。サンプル(map/test02.html)を開いて、内容がほとんどmap/01.htmlと同じ事を確認して下さい。jQuery.eachメソッドで確認する部分です。以下のように確認する配列を「ansArray」ではなく、元のデータ「myArray」にしました。"");});buttonをクリックして名前の前に「Mr.」が追加されていないことを確認して下さい。このサンプルから$.mapメソッドは元のデータは変更しないことが確認できます。実用的なサンプル$.mapメソッドはデータをフィルタリングできるので、特定のデータから任意の要素のみを取得するのに利用します。サンプル(map/test03.html)を開いてjQueryを確認してください。以下の様な配列データ(各要素はobjectオブジェクト)が作成されています。age:30}];そしてbuttonをクリックすると、以下の処理を行うようにしました。ポイントは2行目のif文で、要素のsexプロパティが「female」の場合だけreturnで要素をそのまま返し(3行目)、それ以外はnullを返す(5行目)の処理を行うようにしています。null;}});alert(ansData.length);結果として$.mapメソッドで情勢のデータだけが取得され、変数「ansData」に代入されます(1行目)。8行目で変数「ansData」の要素数をアラートで表示するようにしました。女性データは「meg」と「beth」なので、アラートでは「2」と表示されます。jQuery.eachメソッドを利用してください。→リファレンス:jQuery.eachメソッド「少し実用的なサンプル」このサンプルではフィルタリングするものの、要素を変更していません(3行目で引数のelemをそのまま返しています)。grepメソッドを利用した方が簡単に記述できます。