JQuery 操作數組 each、map、grep、filter

Jquery中對數組的操作大致有一下幾種形式:
1、$.each( collection, callback(indexInArray, valueOfElement) )
$.each()函數和$(selector).each()不一樣。$.each()函數可以用來遍歷任何一個集合,不管是一個JavaScript對象或者是一個數組,如果是一個數組的話,回調函數每次傳遞一個數組的下標和這個下標所對應的數組的值(這個值也可以在函數體中通過this關鍵字獲取,但是JavaScript通常會把this這個值當作一個對象即使他隻是一個簡單的字符串或者是一個數字),這個函數返回所遍歷的對象,也就是這個函數的第一個參數,註意這裡還是原來的那個數組,這是和map的區別。
其中collection代表目標數組,callback代表回調函數(自己定義),回調函數的參數第一個是數組的下標,第二個是數組的元素。當然我們也可以給回調函數隻設定一個參數,這個參數一定是下標,而沒有參數也是可以的。
下面舉個例子:
var mem = ['a','b','c'];
var returnvalue = $.each(mem, function(index) {
alert(index);
});

var mem = ['a','b','c'];
var returnvalue = $.each(mem, function(index,value) {
alert(index + " " + value);
});

var mem = ['a','b','c'];
var returnvalue = $.each(mem, function() {
});

2、$.map( array, callback(elementOfArray, indexInArray) )
$.map()這個函數和each非常的相似,最重要的區別就是map是用來生成一個新的數組,也就是說我們可以在回調函數中修改遍歷到的每一個元素(通過return返回新的值,不return就沒有值瞭),最後返回一個新的數組。
參數方面和each基本沒有什麼區別,不多做解釋。
下面舉個例子:
var arr = [ "a", "b", "c", "d", "e" ];
var arr2 = jQuery.map(arr, function(n, i){
return (n.toUpperCase() + i);
});   www.aiwalls.com
alert(arr);
alert(arr2);
程序執行後的結果為:
a,b,c,d,e
A0,B1,C2,D3,E4

3、$.grep( array, function(elementOfArray, indexInArray) [, invert] )
$.grep()函數除去瞭不需要的元素,起到瞭一個篩選的作用,通過將它的元素通過一個測試函數,也就是grep()的第二個參數,需要註意的是這裡參數和前面兩個函數的回調函數的參數順序相反。通過這兩個參數來控制自己需要哪些元素,通過return語句返回出來(return true說明這個元素是需要的)。另外,在grep()中可以通過正則表達式(return elementOfArray.match(正則表達式))來控制篩選,這樣能使篩選更加的靈活、強大。grep()函數和map()函數一樣也是生成一個新的數組。grep()中的第三個參數是一個佈爾數通常是省略的,默認是false,如果設置為true,那麼回調函數的返回值的效果剛好相反,返回true的會被去掉。
下面舉個例子:
var arr = [ 1, 9, 3, 8, 6, 1, 5, 9, 4, 7, 3, 8, 6, 9, 1 ];
arr = jQuery.grep(arr, function(n, i){
return (n != 5 && i > 4);
});
4、filter (fn) 參數是函數;

作者:cqkxzyi

You May Also Like