总结javascript中的六种迭代器


Posted in Javascript onAugust 16, 2016

1.forEach迭代器

forEach方法接收一个函数作为参数,对数组中每个元素使用这个函数,只调用这个函数,数组本身没有任何变化

//forEach迭代器
function square(num){
  document.write(num + ' ' + num*num + '<br>');
}

var nums = [1,2,3,4,5,6,7,8];
nums.forEach(square);

在浏览器中输出的结果是:

总结javascript中的六种迭代器

2.every迭代器

every方法接受一个返回值为布尔类型的函数,对数组中的每个元素使用这个函数,如果对于所有的元素,该函数均返回true,则该方法返回true,否则返回false

//every迭代器
function isEven(num){
  return num % 2 == 0;
}
var nums = [2,4,6,8];
document.write(nums.every(isEven));

3.some迭代器

some方法也是接受一个返回值为布尔类型的函数,只要有一个元素使得该函数返回true,该方法就返回true

//some迭代器
function isEven(num){
  return num % 2 == 0;
}
var nums = [1,3,5,7];
document.write(nums.some(isEven));

4.reduce迭代器

reduce方法接受一个函数,返回一个值,该方法从一个累加值开始,不断对累加值和数组中的后续元素调用该函数,知道数组中最后一个元素,最后得到返回的累加值

//reduce迭代器
function add(runningTotal, currentValue){
  return runningTotal + currentValue;
}
var nums = [1,2,3,4,5,6,7,8,9,10];
var sum = nums.reduce(add);
document.write(sum);

得到的结果是:55

reduce()函数和add()函数一起,从左到右,一次对数组中的元素求和,执行过程如下:

add(1,2) -> 3
add(3,3) -> 6
add(6,4) -> 10
add(10,5) -> 15
add(15,6) -> 21
add(21,7) -> 28
add(28,8) -> 36
add(36,9) -> 45
add(45,10) -> 55

reduce方法也可以用来将数组中的元素链接成一个长的字符串,代码如下

//使用reduce连接数组元素
function concat(accumulatedString, item){
  return accumulatedString + item;
}
var words = ['the ', 'quick ', 'brown ', 'fox'];
var sentence = words.reduce(concat);
document.write(sentence);

最后输出结果如下:

总结javascript中的六种迭代器

javascript还提供了reduceRight方法,和Reduce方法不同,它是从右到左执行,如下:

//使用reduce连接数组元素
function concat(accumulatedString, item){
  return accumulatedString + item;
}
var words = ['the ', 'quick ', 'brown ', 'fox '];
var sentence = words.reduceRight(concat);
document.write(sentence);

执行结果如下:

总结javascript中的六种迭代器

5.map迭代器

map迭代器和forEach有些类似,但是map会改变数组,生成新的数组,如下代码

//使用map迭代器生成新的数组
function curve(grade){
  return grade+5;
}
var grades = [77,65,81,92,83];
var newgrades = grades.map(curve);
document.write(newgrades);

输出结果:

总结javascript中的六种迭代器

6.fiter迭代器

和every迭代器类似,传入一个返回值为布尔类型的函数,和every方法不同的是,当数组中所有元素对应该函数返回的结果均为true时,该方法并不返回true,而是返回一个新的数组,该数组包含对应函数返回结果为true的元素,代码如下

function isEven(num){
  return num % 2 == 0;
}

function isOdd(num){
  return num % 2 != 0;
}

var nums = [];
for (var i=0; i<20; i++) {
  nums[i] = i+1;
}
var evens = nums.filter(isEven);
document.write(evens);
document.write('<br>');
var odds = nums.filter(isOdd);
document.write(odds);

输出结果如下:

总结javascript中的六种迭代器

总结

以上就是关于javascript中的六种迭代器的总结,希望本文的内容对大家学习工作能有所帮助。

Javascript 相关文章推荐
js检测客户端不是firefox则提示下载
Apr 07 Javascript
JQuery 无废话系列教程(二) jquery实战篇上
Jun 23 Javascript
JS getStyle获取最终样式函数代码
Apr 01 Javascript
node.js中RPC(远程过程调用)的实现原理介绍
Dec 05 Javascript
jQuery平滑旋转幻灯片特效代码分享
Sep 07 Javascript
jQuery实现的登录浮动框效果代码
Sep 26 Javascript
Jquery EasyUI实现treegrid上显示checkbox并取选定值的方法
Apr 29 Javascript
javascript 判断页面访问方式电脑或者移动端
Sep 19 Javascript
js格式化时间的简单实例
Nov 27 Javascript
vue移动端屏幕适配详解
Apr 30 Javascript
利用JS代码自动删除稿件的普通弹幕功能
Sep 20 Javascript
JavaScript数组去重实现方法小结
Jan 17 Javascript
你知道setTimeout是如何运行的吗?
Aug 16 #Javascript
深入理解(function(){... })();
Aug 16 #Javascript
关于JSON与JSONP简单总结
Aug 16 #Javascript
json与jsonp知识小结(推荐)
Aug 16 #Javascript
浅谈JS继承_借用构造函数 &amp; 组合式继承
Aug 16 #Javascript
JS读写CSS样式的方法汇总
Aug 16 #Javascript
浅谈JS继承_寄生式继承 &amp; 寄生组合式继承
Aug 16 #Javascript
You might like
PHP使用适合阅读的格式显示文件大小的方法
2015/03/05 PHP
PHP获取一段文本显示点阵宽度和高度的方法
2015/03/12 PHP
PHP 中使用explode()函数切割字符串为数组的示例
2017/05/06 PHP
stream.js 一个很小、完全独立的Javascript类库
2011/10/28 Javascript
jQuery easyui datagrid动态查询数据实例讲解
2013/02/26 Javascript
如何阻止复制剪切和粘贴事件为了表单内容的安全
2013/05/23 Javascript
关于Javascript与iframe的那些事儿
2013/07/04 Javascript
js获取会话框prompt的返回值的方法
2015/01/10 Javascript
MVVM模式中ViewModel和View、Model有什么区别?
2015/06/19 Javascript
BootstrapTable与KnockoutJS相结合实现增删改查功能【一】
2016/05/10 Javascript
简单掌握JavaScript中const声明常量与变量的用法
2016/05/21 Javascript
JS获取input file绝对路径的方法(推荐)
2016/08/02 Javascript
vue.js开发环境安装教程
2017/03/17 Javascript
JavaScript实现设置默认日期范围为最近40天的方法分析
2017/07/12 Javascript
详解为Bootstrap Modal添加拖拽的方法
2018/01/05 Javascript
js实现购物车功能
2018/06/12 Javascript
在create-react-app中使用css modules的示例代码
2018/07/31 Javascript
vue.js实现二级菜单效果
2019/10/19 Javascript
JQuery使用属性addClass、removeClass和toggleClass实现增加和删除类操作示例
2019/11/18 jQuery
[40:17]2018DOTA2亚洲邀请赛 4.5 淘汰赛 LGD vs Liquid 第一场
2018/04/06 DOTA
Python利用带权重随机数解决抽奖和游戏爆装备问题
2016/06/16 Python
Python编程实现使用线性回归预测数据
2017/12/07 Python
Python+tkinter使用80行代码实现一个计算器实例
2018/01/16 Python
Python实现PS图像调整之对比度调整功能示例
2018/01/26 Python
python生成ppt的方法
2018/06/07 Python
Python 打印中文字符的三种方法
2018/08/14 Python
Django 多表关联 存储 使用方法详解 ManyToManyField save
2019/08/09 Python
在python Numpy中求向量和矩阵的范数实例
2019/08/26 Python
使用Python提取文本中含有特定字符串的方法示例
2020/12/09 Python
简述Linux文件系统通过i节点把文件的逻辑结构和物理结构转换的工作过程
2012/04/17 面试题
农民入党思想汇报
2014/01/03 职场文书
幼儿园秋游活动方案
2014/01/21 职场文书
社区中秋节活动方案
2014/01/29 职场文书
党的群众路线教育实践活动党员个人剖析材料
2014/10/08 职场文书
2015年社区创卫工作总结
2015/04/21 职场文书
2016中秋节晚会开场白
2015/11/26 职场文书