Jquery中grep()方法的使用

jquery中有个grep()方法用于数组元素过滤筛选

grep()的使用方法： grep(array,callback,invert)

• array：待过滤数组;
• callback：处理数组中的每个元素，并过滤元素，该函数中包含两个参数，第一个是当前数组元素的值，一个是当前数组元素的下标，即元素索引值。此函数应返回一个布尔值。另外，此函数可设置为一个字符串，当设置为字符串时，将视为“lambda-form”（缩写形式？），其中 a 代表数组元素，i 代表元素索引值。如“a > 0”代表“function(a){ return a > 0; }”
• invert：布尔型可选项，默认值false，值为true或false， 如果 “invert” 为 false 或为设置，则函数返回数组中由过滤函数返回 true 的元素，当”invert” 为 true，则返回过滤函数中返回 false 的元素集。

解释完grep()的用法，现在来举个小例子： var arr=$.grep([0,1,2,3,4,5,6],function(n,i){ return n>2 }); 上面的例子返回[3,4,5,6]，但是我们给invert的值为true，例如 var arr=$.grep([0,1,2,3,4,5,6],function(n,i){ return n>2 },ture); 所以现在返回的是[0,1,2]，也就是被callback函数过滤掉的元素。

 

var nums ='1,2,3,4,5,jQuery,CSS,5'.split(',');

可见数组中有数字和字符串，如果我们想找出其中的字符串，我们可以直接使用 $.grep() 方法来完成这个任务，如下：

nums = $.grep(nums,function(num, index){
    // num = 数组元素的当前值 
    // index = 当前值的下标
    return isNaN(num);
});
console.log(nums);//结果为： ["jQuery", "CSS"] 

我们很容易想到 $.map() 方法，$.map() 方法可将一个数组转换为另一个数组，所以，使用 $.map() 方法也可以完成这个任务，如下：

nums = $.map(nums,function(num, index){
    //和$.grep() 的区别
    //return isNaN,得到结果为：[true, true]
    return isNaN(num)? num :null;
});
console.log(nums);// ["jQuery", "CSS"]

本篇简单介绍了下 $.grep() 方法的使用，同时对比了下 $.map() 方法。可见，适当的使用 jQuery 内置方法可简化我们的程序。