javaScript数组迭代方法详解


Posted in Javascript onApril 14, 2016

本文为大家介绍了javaScript数组迭代方法,供大家参考,具体内容如下

每个方法都接收两个参数:要在每一项上运行的函数  和  (可选的)运行该函数的作用域对象。

传入这些方法中的函数会接收三个参数:数组项的值,该项在数组中的位置,数组对象本身。

forEach()  对数组中的每一项运行 给定函数。该方法没有返回值。
every()  对数组中的每一项运行 给定函数,如果数组的每一项都返回true,则返回true。
some()  对数组中的每一项运行 给定函数,如果数组的任意一项返回true,则返回true。
fliter()  如果数组的每一项都返回true,则返回true。返回该函数会返回true的项组成的数组。
map()  如果数组的每一项都返回true,则返回true。返回每次函数调用的结果组成的数组。

请看以下例子:

var numbers = [1,2,3,4,5,4,3,2,1];
//every()
var everyResult = numbers.every(function(item, index, array){
 return (item > 2);
});
alert(everyResult); //false
//some()
var someResult = numbers.some(function(item, index, array){
 return (item > 2);
});
alert(someResult); //true
//filter()
var filterResult = numbers.filter(function(item, index, array){
 return (item > 2);
});
alert(filterResult); //[3,4,5,4,3]
//map()
var mapResult = numbers.map(function(item, index, array){
 return (item * 2);
});
alert(mapResult); //[2,4,6,8,10,8,6,4,2]
//forEach()
numbers.forEach(function(item, index, array){
 alert(item);
}); //多个弹窗分别显示数组中的元素

另一个javaScript数组迭代方法,如下

var arr = [3,4,5,6,7,"a"];

var isNum = function(elem,index,AAA){
return !isNaN(elem);
}

var toUpperCase = function(elem){
return String.prototype.toUpperCase.apply(elem);
}

var print = function(elem,index){
console.log(index+"."+elem);
}

/*对数组中的每一项执行测试函数,直到获得对指定的函数返回 false 的项。 使用此方法 可确定数组中的所有项是否满足某一条件,类似于&&的含义*/
var res = arr.every(isNum);
console.log(res);//false;

/*对数组中的每一项执行测试函数,直到获得返回 true 的项。 使用此方法确定数组中的所有项是否满足条件.类似于||的含义*/
res = arr.some(isNum);
console.log(res);//true

/*对数组中的每一项执行测试函数,并构造一个新数组,返回 true的项被添加进新数组。 如果某项返回 false,则新数组中将不包含此项*/
res = arr.filter(isNum);
console.log(res);//[3, 4, 5, 6, 7]

/*对数组中的每一项执行函数并构造一个新数组,并将原始数组中的每一项的函数结添加进新数组。*/
res = arr.map(toUpperCase);
console.log(res);//["3", "4", "5", "6", "7", "A"]

/*对数组中的每一项执行函数,不返回值*/
res = arr.forEach(print);
console.log(res);

 

 

//自己扩展

/*Array.prototype.every = function(fun,obj) {
var len = this.length;
if (typeof fun != "function")
throw new TypeError();
for (var i = 0; i < len; i++) {
if (!fun.call(obj,this[i], i,this))
return false;
}
return true;
};*/

以上就是本文的全部内容,希望对大家学习javaScript数组迭代方法有所帮助。

Javascript 相关文章推荐
Google Suggest ;-) 基于js的动态下拉菜单
Oct 11 Javascript
IE Firefox 使用自定义标签的区别
Oct 15 Javascript
location.href 在IE6中不跳转的解决方法与推荐使用代码
Jul 08 Javascript
json数据与字符串的相互转化示例
Sep 18 Javascript
javascript修改表格背景色实例代码分享
Dec 10 Javascript
JavaScript function 的 length 属性使用介绍
Sep 15 Javascript
javascript中Array数组的迭代方法实例分析
Feb 04 Javascript
javascript中eval函数用法分析
Apr 25 Javascript
Vue单文件组件基础模板小结
Aug 10 Javascript
Angular开发实践之服务端渲染
Mar 29 Javascript
vue cli4下环境变量和模式示例详解
Apr 09 Javascript
原生js实现表格翻页和跳转
Sep 29 Javascript
基于JS实现移动端访问PC端页面时跳转到对应的移动端网页
Dec 24 #Javascript
js贪吃蛇游戏实现思路和源码
Apr 14 #Javascript
JS跨域解决方案之使用CORS实现跨域
Apr 14 #Javascript
[原创]Bootstrap 中下拉菜单修改成鼠标悬停直接显示
Apr 14 #Javascript
Seajs 简易文档 提供简单、极致的模块化开发体验
Apr 13 #Javascript
原生js编写autoComplete插件
Apr 13 #Javascript
JS中的eval 为什么加括号
Apr 13 #Javascript
You might like
php实现指定字符串中查找子字符串的方法
2015/03/17 PHP
php 的多进程操作实践案例分析
2020/02/28 PHP
DWZ table的原生分页浅谈
2013/03/01 Javascript
jquery中load方法的用法及注意事项说明
2014/02/22 Javascript
jQuery 中的 DOM 操作
2016/04/26 Javascript
微信小程序 教程之事件
2016/10/18 Javascript
详解MVC如何使用开源分页插件(shenniu.pager.js)
2016/12/16 Javascript
MvcPager分页控件 适用于Bootstrap
2017/06/03 Javascript
jQuery ajax调用webservice注意事项
2017/10/08 jQuery
解决Vue使用mint-ui loadmore实现上拉加载与下拉刷新出现一个页面使用多个上拉加载后冲突问题
2017/11/07 Javascript
深入浅析Vue 中 ref 的使用
2019/04/29 Javascript
Vue父组件如何获取子组件中的变量
2019/07/24 Javascript
使用p5.js实现动态GIF图片临摹重现
2019/10/23 Javascript
vue 基于abstract 路由模式 实现页面内嵌的示例代码
2020/12/14 Vue.js
[41:11]完美世界DOTA2联赛PWL S2 Inki vs Magma 第一场 11.22
2020/11/24 DOTA
深入解析Python中的urllib2模块
2015/11/13 Python
Python中字符串的修改及传参详解
2016/11/30 Python
pygame游戏之旅 按钮上添加文字的方法
2018/11/21 Python
Python从Excel中读取日期一列的方法
2018/11/28 Python
Python之虚拟环境virtualenv,pipreqs生成项目依赖第三方包的方法
2019/07/23 Python
python读写Excel表格的实例代码(简单实用)
2019/12/19 Python
python如何停止递归
2020/09/09 Python
Django跨域请求原理及实现代码
2020/11/14 Python
python unichr函数知识点总结
2020/12/16 Python
html5摇一摇代码优化包括DeviceMotionEvent等等
2014/09/01 HTML / CSS
荷兰优雅女装网上商店:Heine
2016/11/14 全球购物
说说你所熟悉或听说过的j2ee中的几种常用模式?及对设计模式的一些看法
2012/05/24 面试题
我们的节日春节活动方案
2014/08/22 职场文书
全国法院系统开展党的群众路线教育实践活动综述(全文)
2014/10/25 职场文书
优秀班主任先进事迹材料
2014/12/16 职场文书
幼儿园教师考核评语
2014/12/31 职场文书
高三英语教学计划
2015/01/23 职场文书
2015年中秋节演讲稿
2015/03/20 职场文书
浅谈golang 中time.After释放的问题
2021/05/05 Golang
JS + HTML 罗盘式时钟的实现
2021/05/21 Javascript
【TED出品】天梯非主流开心游1700 划水骑士
2022/03/31 魔兽争霸