js数组之迭代方法
ES5为数组对象定义了5个迭代方法(即递归,简单的说就是自己可以调用自己)。
每个方法接收两个参数:要在每一项上运行的函数(接收3个参数:数组项的值,该项在数组中的位置,数组对象本身)和(可选的)运行该函数的作用域对象——影响this的值。
以下是这5个迭代方法的作用:
every()对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则返回true ;
filter()对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组 ;
forEach()对数组中的每一项运行给定函数,这个方法没有返回值 ;
map()对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组 ;
some()对数组中的每一项运行给定函数,如果该函数对任一项返回true,则返回true;
ps:以上方法不会修改数组中包含的值。
以上方法中,最相似的是every()和some()方法,他们都用于查询数组中的项是否满足某个条件。
对于every()来说,传入的函数必须每一项都返回true,这个方法才返回true;反之,返回false;
而some(),只要传入的函数对数组中的项有一项返回true,则返回true;也就是说some()方法返回false()的可能就是传入的和数组中完全对不上号的时候。------其实我看到这里,有没有觉得它和‘与或非’逻辑门很像?理解性的说,every()就是‘与’,some()就是‘或’,这样就好理解多了。
for example:
var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.every(function(item,index,array){
return (item>2);
});
alert(everyResult); //false;
var someResult = numbers.some(function(item,index,array){
return (item>2);
});
alert(someResult); //true;
以上代码调用了every()和some(),传入的函数只要给定项大于2就会返回true。
对于every(), 它返回的是 false,因为只有部分数组项符合条件。
对于 some(),结果就是 true,因为至少有一项是大于 2的。
filter()函数:它利用指定的函数确定是否在返回的数组中包含某一项。------跟jquery中filter()选择器类似,起一个过滤的作用,返回传入项与数组中相匹配的项。
for example:
var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.filter(function(item, index, array){ return (item > 2); });
alert(filterResult); //[3,4,5,4,3]
这里,通过调用 filter()方法创建并返回了包含 3、4、5、4、3的数组,因为传入的函数对它们 每一项都返回 true。这个方法对查询符合某些条件的所有数组项非常有用
map()也返回一个数组,而这个数组的每一项都是在原始数组中的对应项上运行传入函数的结果。------可以当作是遍历数组并对数组中的每一项执行所要执行的函数。
例如,可以给数组中的每一项乘以 2,然后返回这些乘积组成的数组,如下所示。
var numbers = [1,2,3,4,5,4,3,2,1];
var mapResult = numbers.map(function(item, index, array){ return item * 2; });
alert(mapResult); //[2,4,6,8,10,8,6,4,2]
以上代码返回的数组中包含给每个数乘以 2之后的结果。这个方法适合创建包含的项与另一个数组 一一对应的数组。
最后一个方法是 forEach(),它只是对数组中的每一项运行传入的函数。这个方法没有返回值, 本质上与使用 for 循环迭代数组一样。来看一个例子。
var numbers = [1,2,3,4,5,4,3,2,1];
numbers.forEach(function(item, index, array){ //执行某些操作 });
ps:这些数组方法通过执行不同的操作,可以大大方便处理数组的任务。支持这些迭代方法的浏览器有 IE9+、Firefox 2+、Safari 3+、Opera 9.5+和 Chrome。
pps:本人js小白一枚,以上仅是本人看书过程中看到的一些东西,也加一些自己理解的方法,若有不对,欢迎指正,谢谢。
js数组之迭代方法的更多相关文章
- JS中数组的迭代方法和归并方法
昨天总结的JavaScript中的数组Array方法 数组的迭代方法 ES5中为数组定义了5个迭代方法.每个方法都要接收两个参数:要在每一项上面运行的函数和(可选的)运行该函数的作用域对象---影响t ...
- JavaScript之数组五大迭代方法总结
ES5定义了五个迭代方法,每个方法都接收两个参数:要在每一项上运行的函数和运行该函数的作用域对象(可选的),作用域对象将影响this的值.传入这些方法中的函数会接收三个参数:数组的项的值.该项在数组中 ...
- 一张图看懂JavaScript中数组的迭代方法:forEach、map、filter、reduce、every、some
好吧,竟然不能单发一张图,不够200字啊不够200字! 在<JavaScript高级程序设计>中,分门别类介绍了非常多数组方法,其中迭代方法里面有6种,这6种方法在实际项目有着非常广泛的作 ...
- js数组去重的方法(转)
JS数组去重的几种常见方法 一.简单的去重方法 // 最简单数组去重法 /* * 新建一新数组,遍历传入数组,值不在新数组就push进该新数组中 * IE8以下不支持数组的indexOf方法 * */ ...
- js数组定义和方法 (包含ES5新增数组方法)
数组Array 1. 数组定义 一系列数据的集合成为数组.数组的元素可以为任何类型的数据(包括数组,函数等),每个元素之间用逗号隔开,数组格式:[1,2,3]. 2. 数组创建方式 (1) 字面量方法 ...
- js数组高阶方法reduce经典用法代码分享
以下是个人在工作中收藏总结的一些关于javascript数组方法reduce的相关代码片段,后续遇到其他使用这个函数的场景,将会陆续添加,这里作为备忘. javascript数组那么多方法,为什么我要 ...
- js 数组的迭代
es5新增加的迭代方法(every,filter,forEach,map,some) arr1 = [1,2,3,4,5,6]; 1,every(); every() 方法使用指定函数检测数组中的所有 ...
- js数组的各种方法
1.检测数组 ①Instanceof: if(value instanceof Array){ } 它假定只有一个全局执行环境,若网页中包含多个框架,则存在多个不同的全局执行环境,则Instanceo ...
- JavaScript中数组的迭代方法:forEach、map、filter、reduce、every、some、for in、for of
JavaScript中有非常多数组迭代方法,这里基本上吧所有的都介绍全了,我项目中比较喜欢的是forEach. 7.for in (for-in循环实际是为循环对象而设计的,for in也可以循环数组 ...
随机推荐
- JS-DOM操作应用高级(二)
搜索 字符串比较.忽略大小写----大小写转换.模糊搜索----search的使用.split.高亮显示及筛选 toLowerCase() 方法用于把字符串转换为小写 str.search('') ...
- 初探JavaScript魅力(五)
JS简易日历 innerHTML <title>无标题文档</title> <script> var neirong=['一','二','三','四','五' ...
- 【转载】GDI 映像方式 之 SetViewportExtEx 与 SetWindowExtEx 解析
所谓视口代表设备,比如屏幕. 窗口代表我们的思维. 我们对windows说在(5,6)处画个点(调用GDI函数).windows认为是在我们的思维的(5,6)处画了个点.(也就是说5,6是逻辑坐标,G ...
- java 文件字节输入流
Example10_4.java import java.io.*; public class Example10_4 { public static void main(String args[]) ...
- spark中groupByKey与reducByKey
[译]避免使用GroupByKey Scala Spark 技术 by:leotse 原文:Avoid GroupByKey 译文 让我们来看两个wordcount的例子,一个使用了reduceB ...
- L4,an exciting trip
expressions: a great number of 许多 in the centre of 在…的中部 sentences: I have just had breakfast. I hav ...
- Mysql中int(2)和int(10)的区别
int(N)中的N不是限制字段取值范围的,int的取值范围是固定的(0至4294967295)或(-2147483648至2147483647) 那么N这个值是为了在字段中的值不够时补零的,但是必须含 ...
- 全新安装免费的OS X Mavericks 10.9正式版--安装U盘制作指南
承诺大家的教程来了,这个教程是介绍如何在Mac下制作安装正版USB启动安装程序,原教程出自Tonymacx86.我只是加入了自己的理解,用自己的方式给大家讲这个过程.这里要把所有的成绩归功于Tonym ...
- ajax编程**
ajax 编程 *step1获得 XmlHttpRequest 对象.该对象由浏览器提供,但是该类型并没有标准化.ie 和其它浏览器不同,其它浏览器都支持该类型,而 ie 不支持. function ...
- PAT (Advanced Level) 1054. The Dominant Color (20)
简单题 #include<cstdio> #include<cstring> #include<cmath> #include<vector> #inc ...