$.grep()

配列とフィルタ関数をして、フィルタ条件を満たす配列要素だけを取り出します。

$.grep( array, function(element, index) [, invert] ) 1.0追加

戻り値:Array

引数 説明
array フィルタリング対象となる配列を指定します。
function(element, index) フィルタリングの関数を指定します。戻り値はBoolean値を指定すべきです。 この関数内でのthisはグローバル空間が参照されます。
element
対象となる要素を参照します。
index
対象となる要素のインデックス番号です。
[invert] falseまたは指定が無ければ、関数がtrueを返した要素で戻り値の配列を構築します。 trueが指定されれば、関数がfalseを返した要素で戻り値の配列を構築します。

このメソッドはグローバル空間で実行されるという点で、javaScriptのeval()メソッドと異なります。 (外部スクリプトを直接読み込む際に重宝します)

サンプル

引数invertについての例です。まず、invert無しであれば、

$.grep( [0,1,2], function(n,i){
  return n > 0;
});

結果はこのようになります。

[1, 2]

次に先ほどのgrepの第3引数にtrueを指定します。

$.grep( [0,1,2], function(n,i){
  return n > 0;
}, true); //invertにtrueを指定

さっきとは真逆の結果になります。

[0]

デモ

始めにarrの値を全て出力し、次に値が5では無い且つインデックス番号が4より大きものでフィルタリングして出力、 最後に値が9で無いものをフィルタリングして出力しています。

<!DOCTYPE html>
<html>
<head>
<style>
  div { color:blue; }
  p { color:green; margin:0; }
  span { color:red; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div></div>
<p></p>
<span></span>
<script>
var arr = [ 1, 9, 3, 8, 6, 1, 5, 9, 4, 7, 3, 8, 6, 9, 1 ];
$("div").text(arr.join(", "));
arr = jQuery.grep(arr, function(n, i){
  return (n != 5 && i > 4);
});
$("p").text(arr.join(", "));

arr = jQuery.grep(arr, function (a) { return a != 9; });
$("span").text(arr.join(", "));
</script>
</body>
</html>

 Back to top

© 2010 - 2017 STUDIO KINGDOM