jQuery 「ユーティリティ」配列を操作する
$.merge()は、2つの配列をマージします。配列2のすべての要素が、配列1に追加されますので、配列1を処理前の状態で残したい場合は、あらかじめ複製します。
$.map()は、配列またはオブジェクトの各要素に対してコールバック関数の処理を適用し、その結果を新しい配列として返します。このメソッドはjQuery1.6から配列だけでなくオブジェクトを扱えるようになりました。ただし、jQueryオブジェクトを対象にしたい場合は$.map()ではなく、jQueryオブジェクト.map()メソッドを使用します。
$grep()は、配列をフィルタ関数に通し、その条件判断にマッチする要素を新たな配列として返します。フィルタ関数はtrueまたはfalseを返す関数である必要があり、第3引数のスイッチによって、戻り値の配列に含める要素を切り替えられます。スイッチがtrueの場合はフィルタがfalseを返した要素falseの場合はフィルタがtrueを返した要素だけが、戻り値の配列に含まれます。
$.makeArray()は、オブジェクトを配列に変換します。例えば、jQueryオブジェクトをJavaScriptの配列操作関数を使って処理したいといった場合に便利です。
$.uniqueSort()は、DOM要素の配列から重複を除去してソートします。このメソッドはjQuery3.0以前は$.unique()として実装されていましたが、$.unique()は非推奨になり$.uniqueSort()となりました。
書式
$.merge(配列1,配列2)
$.map( 配列またはオブジェクト,コールバック(配列またはオブジェクト要素,インデックスまたはキー))
$.grep( 配列 , フィルタ関数( 配列要素 , インデックス ),[ スィッチ ] )
$.MakeArray( オブジェクト )
$.uniqueSort( 配列 )$.merge( arr1, arr2 )
$.map(arr, function(n, i){・・・処理・・・})
$.grep(arr, function(n,i){・・・処理・・・; return true;},false)
$.uniqueSort(arr)サンプル
１、配列をマージする
<script>
$(document).ready(function(){
var arr1 = ['apple','orange','grape'];
var arr2 = ['melon','strawberry','cherry'];
$.merge(arr1,arr2);
alert(arr1.toString());
});
</script>
２、配列の各要素を処理する
<script>
$(document).ready(function(){
var arr1 = ['apple','orange','grape'];
var arr2 = $.map(arr1, function(n,i){
if(i % 2 == 0){
return n+ 'fruits';
}
});
alert(arr2.toString());
});
</script>
３、配列の要素をフィルタする
<script>
$(document).ready(function(){
var arr1 = ['apple','orange','grape'];
var arr2 = $.grep(arr1, function(n,i){
if( n.length > 5){
return true;
}
});
alert(arr2.toString());
});
</script>
４、オブジェクトを配列に変換する
<body>
<div>あ</div>
<div>い</div>
<div>う</div>
<div>え</div>
<div>お</div>
<script>
$(document).ready(function(){
var obj = $('div');
var arr = $.makeArray(obj);
arr.reverse();
$(arr).appendTo(document.body);
});
</script>
</body>