第4回 要素の操作&ユーティリティ編連載:jQuery逆引きリファレンス(12/19 ページ)

» 2010年02月12日 00時00分 公開



「連載:jQuery逆引きリファレンス」のインデックス

連載目次


 「$.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メソッドは通常の配列を対象としている点が異なります。

Copyright© Digital Advantage Corp. All Rights Reserved.

RSSについて

アイティメディアIDについて

メールマガジン登録

@ITのメールマガジンは、 もちろん、すべて無料です。ぜひメールマガジンをご購読ください。