第4回 要素の操作＆ユーティリティ編：連載：jQuery逆引きリファレンス（12/19 ページ）

[山田祥寛（http://www.wings.msn.to/），著]

連載目次

　「$.map」メソッドは、配列aryの内容をコールバック関数fncで処理し、その結果で新しい配列を生成します。

　コールバック関数fncは、以下のような性質を持ちます。

• 第1引数は、配列の個々の値を受け取る
• 第2引数は、配列のインデックス番号を受け取る
• 処理後の要素を表す値を、戻り値として返す

　具体的な例を見てみましょう。以下は、配列dataの要素をすべて2倍したものを返す例です。

<script type="text/javascript">

$(function() {

  // 配列dataを定義
  var data = [1, 2, 3, 4, 5];

  // 配列dataの内容を処理
  var data2 = $.map(
    data,
    function(value, index) {
      return value * 2; // 個々の要素の値を2倍
    });
  window.alert(data2);
});

</script>

リスト071 配列dataの要素をすべて2倍（Map.htm）
このHTMLを実際にブラウザで開く

ブラウザで開く

リスト071の実行結果

　$.mapメソッドは、インスタンス・メソッドmapとも似ていますが、mapメソッドがjQueryオブジェクトを対象としているのに対して、$.eachメソッドは通常の配列を対象としている点が異なります。