javascript中数组遍历方法forEach,every,some的区别
假设有一个有序数组[1, 2, 3, 4, 5, 6, 7, 8, 9],我们要找出其中所有小于等于5的元素,为了节约时间,要在找完符合条件的所有数据时退出循环。
forEach:
var s = [1, 2, 3, 4, 5, 6, 7, 8, 9];
s.forEach( function (elem, index) {
console.log("第"+index+"次循环:"+elem);
if(elem >5) return;
})
打印出的结果为:
第0次循环:1
第1次循环:2
第2次循环:3
第3次循环:4
第4次循环:5
第5次循环:6
第5次循环:6
第6次循环:7
第7次循环:8
第8次循环:9
结果发现return并不能终止循环,遍历还是会继续进行下去。
every:
var s = [1, 2, 3, 4, 5, 6, 7, 8, 9];
s.every( function (elem, index) {
console.log("第"+index+"次循环:"+elem);
if(elem <=5) return true;
})
结果:
第0次循环:1
第1次循环:2
第2次循环:3
第3次循环:4
第4次循环:5
第5次循环:6
发现循环遍历可以控制了,不过如果要按照需求来做,那么应将if条件改为“<”号,因为every每轮循环返回的boolean值将决定下轮循环是否执行,true为是,false为否,false为默认返回值。
some:
var s = [1, 2, 3, 4, 5, 6, 7, 8, 9];
s.some( function (elem, index) {
console.log("第"+index+"次循环:"+elem);
if(elem >= 5) return true;
})
结果:
第0次循环:1
第1次循环:2
第2次循环:3
第3次循环:4
第4次循环:5
发现some中默认返回值和every一样也是false,不过和every不一样的是true控制some跳出循环(不再进行下一次循环)。
总结
forEach:循环不可控
every,some循环可控
跳出循环条件:
every—return false(默认)
some—return true
继续执行条件:
every—return true
some—return false(默认)
————————————————
以上转自:https://blog.csdn.net/u013668370/article/details/78510462
以下是用法
当想跳出循环可以使用every 和 some方法,下面是简单的总结
every 当内部return false时跳出整个循环(return true;也是需要写)
//every()当内部return false时跳出整个循环 let list = [1, 2, 3, 4, 5]; list.every((value, index) => { if(value > 3){ console.log(value)// 4 return false; }else{ console.log(value)// 1 2 3 return true; } }); list.every((value, index) => { if(value > 3){ console.log(value) return false; }else{ console.log(value)// 1 // return true; // 如果没有返回值true 的话,也会跳出循环 } });
forEach没有返回值,只针对每个元素调用func。
// forEach没有返回值,只针对每个元素调用func。 let list2 = [1, 2, 3, 4, 5]; list2.forEach((value, index) => { if(value > 3){ console.log(value)// 4 5 return false;//没有返回值,ruturn false 仍向下执行 }else{ console.log(value)// 1 2 3 return true; } });
some 当内部return true时跳出整个循环
let list3 = [1, 2, 3, 4, 5]; list3.some((value, index) => { if(value === 3){ return true;//当内部return true时跳出整个循环 } console.log(value)// 1 2 });
map 有返回值,返回一个新的数组,每个元素为调用func的结果。
let list5 = [1, 2, 3, 4, 5]; let arr = []; arr = list5.map((value, index) => { return value * 2; }); console.log(arr);//[2, 4, 6, 8, 10]
ES5为数组新增了5个迭代方法,语法简单易懂,而且非常实用,大大方便了处理数组的任务。
这5个迭代方法的函数接受3个参数:数组中当前项的值、该项在数组中的索引值和数组对象本身。
1. every
作用:对数组中的每一项运行给定函数,如果每一项的运行结果都返回 true,则返回 true。
示例:
// 示例数组var arr = [3, 'abc', 6, 0, '5', 8, true, null, function(){console.warn('hello')}, {a:1, b:2}];var result = null;// 判断数组中每一项是否都为 Number 类型result = arr.every(function(item) { return !isNaN(item);});console.log('结果:' + result); // 结果:false
2. some
作用:与 every 方法作用类似,但 every 是只有每一项都为 true 才整体返回 true,而 some 是只要数组任何一项返回 true 则整体返回 true。
示例:
// 判断数组中是否存在 Boolean 类型result = arr.some(function(item) { return typeof item === 'boolean';});console.log('结果:' + result); // 结果:true
3. filter
作用:顾名思义有“过滤”的意思,运行给定函数返回 false 的数组项会被过滤掉,而返回 true 的每一项会组成一个数组被整体返回。
示例:
// 返回数组中所有的偶数result = arr.filter(function(item) { if (!isNaN(item)) { return item % 2 === 0; }});console.log('结果:' + result); // 结果:6,0,8
注:整体返回的是一个数组
4. map
作用:前面3个方法都是和 true | false 打交道的,即通过判断给定函数运行结果的布尔值来处理数组,map是直接针对每一项,返回每次运行给定函数结果组成的数组。
示例:
// 将数组所有项都转换成字符串result = arr.map(function(item) { return String(item);});console.log('结果:' + result); // 结果:'3','abc','6','0','5','8','true','null','function(){console.warn('hello')}','[object Object]'
注:整体返回的是一个数组
5. forEach
作用:这个方法本质上和使用 for 循环迭代数组是一样的,但代码更加优雅简洁。
示例:
// 遍历数组,找到 Function 类型并运行arr.forEach(function(item) { if (typeof item === 'function') { eval(item()); // console控制台输出:hello }});
注:这个方法没有返回值