ECMAScript 5.1 版本下对 javascript 数组元素的扩展方法(二)
数组元素迭代方法还剩下 filter , some , every
3. filter
过滤数组,将数组元素迭代,依次调用回调函数
array.filter(callback);
实例:
我们遍历迭代a数组,然后每个元素对2整除,符合条件的返回.
var a=[1,2,3]; var b=a.filter(function(item,index,a){ return item%2==0; }); console.log(b);
filter 第一个参数是回调函数
function(item,index,a)
item 是当前迭代元素
index 当前迭代元素所在索引
a 是数组的实例.
看下结果:
返回结果我们验证了b 是一个数组.
上面的 filter 函数感觉和 map 实在是太像了,唯一不同的是返回结果 ,map 是在每个迭代元素做操作后返回新元素,老数组和新数组元素个数一致.
filter 是迭代每个元素后,执行回调函数看元素是否符合条件,符合及返回,不符合不返回.所以老数组和新数组元素个数不一致.
基于上面的一点点区别,那么如果浏览器不支持 filter 时,我们完全可以按照 map 的实现方式来实现:
if (typeof Array.prototype.filter != "function") { Array.prototype.filter = function (fn) { var arr = []; if (typeof fn === "function") { for (var k = 0, length = this.length; k < length; k++) { if(fn.call(this[k], k, this)) arr.push(this[k]); } } return arr; }; }
上面代码我们用一个for 循环遍历数组,然后数组每个元素调用 fn 函数,
if(fn.call(this[k],k,this))
如果调用 fn 函数返回 true 时,把新元素 push 到 arr 新数组中.
否则不做任何处理.
4.some
满足其中一些项(最少一个,最多不限)
array.some(callback);
some在迭代数组元素时,会通过回调函数 callback 来对元素做验证,只要有一项为 true , some 就返回 true .
我们从一个数组中找到小于0的元素:
var a=[1,2,3,-5]; console.log( a.some(function(item,index,arr){ return item<0; }) );
回调函数 function(item,index,arr) 参数和上面一致,分别表示 当前迭代元素,当前元素所在的索引,数组实例
当你的浏览器不支持此方法时,你可以自己在数组原型链上定义一个同名方法,然后自己实现此功能如下:
if (typeof Array.prototype.some != "function") { Array.prototype.some = function (fn) { var checked = false; if (typeof fn === "function") { for (var k = 0, length = this.length; k < length; k++) { if (checked === true) break; checked = !!fn.call(this[k], k, this); } } return checked; }; }
上面定义的 some 函数接收一个参数 fn (这是一个回调处理函数,在数组遍历时用来处理一些自定义的逻辑处理)
在for 循环中,元素迭代时,如果 checked 为true ,直接跳出循环(因为已经至少返回了一个 true )
如果 checked 不为 true ,那么把迭代元素作为参数传入回调函数 fn 中做逻辑判断.
5.every
every 和 some 正好相反.
every 是在元素迭代过程中,每个元素在回调函数操作中都要返回 true 才可以.( some 是至少有一个返回 true 即可)
array.every(callback);
和 some 函数一样,接收callback 回调函数. 返回 ture / false
我们要求一个数组所有元素都必须是正整数,看下面的示例:
var a=[1,2,3,5]; console.log(a.every(function(item,idex,arr){ return item>0; }));
运行结果返回 true
接着考虑下如果遇到浏览器不支持此方法,我们该如何定义一个同名的函数呢.
其实有了上面的 some 函数实现,我们很容易想到 every 的实现,我们只需要给 checked=true;
当迭代元素执行回调函数时,如果有一个false ,就直接跳出循环.
if (typeof Array.prototype.every != "function") { Array.prototype.every = function (fn) { var checked = true; if (typeof fn === "function") { for (var k = 0, length = this.length; k < length; k++) { if (checked === false) break; checked = !!fn.call(this[k], k, this); } } return checked; }; }
上面2篇的简单介绍,终于吧 ECMAScript 5.1 数组中新增的迭代元素方法介绍完了.
***end***