首页 > 代码库 > 解析$.grep()源码及透过$.grep()看(两次去反)!!的作用
解析$.grep()源码及透过$.grep()看(两次去反)!!的作用
先上jquery源码：
1 grep: function( elems, callback, inv ) { 2 var retVal, 3 ret = [], 4 i = 0, 5 length = elems.length; 6 inv = !!inv; 7 8 // Go through the array, only saving the items 9 // that pass the validator function10 for ( ; i < length; i++ ) {11 retVal = !!callback( elems[ i ], i );12 if ( inv !== retVal ) {13 ret.push( elems[ i ] );14 }15 }16 17 return ret;18 },
这里的grep(过滤方法)不仅可以过滤数组，还可以过滤jquery中的this(jquery对象)和类数组（arguments）;
它可以接受三个参数，第一个参数为需要操作的数组，第二个参数为数组每一项需要进行的回调函数；第三个参数可有可无的布尔值（当第三个参数没有时及undefined或者为null的时候通过!!inv转化为false）；
对于callback执行的结果来说可能是布尔值，也可能是null或者undefined；所以又用到了两次取反保证最后得到的是一个布尔值；
callback有两个参数：第一个参数为数组的一个元素，第二个参数为index下标
当第三个参数为false/null或者说没有第三个参数(undefined)的时候;通过if ( inv !== retVal )得到的数组是retVal为true及callback返回为true的，也及是得到的是筛选出来的；如果第三个参数true，通过if ( inv !== retVal )得到的数组是retVal为false及callback返回为false的，也及是得到的是筛选之剩下的(过滤掉的)；
1 var arr=$.grep([0,1,2,3,4,5,6],function(n,i){2 return n>23 });4 上面的例子返回[3,4,5,6]，但是我们给inv的值为true，例如5 var arr=$.grep([0,1,2,3,4,5,6],function(n,i){6 return n>27 },ture);8 所以现在返回的是[0,1,2]，也就是被callback函数过滤掉的元素。对于两次取反
由于对null与undefined用!操作符时都会产生true的结果，所以用两个感叹号的作用就在于，如果给出了第三个参数且非null/undefined/0""/等值，则inv为true，否则为false。
这样做的目的就是保证inv和retVal的值都只能在true/false中取，而非其它值null/undefined等，为后续判断提供便利。
1 var o={flag:true};2 var test=!!o.flag;//等效于var test=o.flag||false;当o没有flag属性的时候也可以得到布尔值test3 alert(test)
解析$.grep()源码及透过$.grep()看(两次去反)!!的作用
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。