源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

总结javascript中的六种迭代器

  • 时间:2021-01-04 11:49 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:总结javascript中的六种迭代器
[b]1.forEach迭代器[/b] forEach方法接收一个函数作为参数,对数组中每个元素使用这个函数,只调用这个函数,数组本身没有任何变化
//forEach迭代器
function square(num){
  document.write(num + ' ' + num*num + '<br>');
}

var nums = [1,2,3,4,5,6,7,8];
nums.forEach(square);
在浏览器中输出的结果是: [img]http://files.jb51.net/file_images/article/201608/2016081610212615.png[/img] [b]2.every迭代器[/b] every方法接受一个返回值为布尔类型的函数,对数组中的每个元素使用这个函数,如果对于所有的元素,该函数均返回true,则该方法返回true,否则返回false
//every迭代器
function isEven(num){
  return num % 2 == 0;
}
var nums = [2,4,6,8];
document.write(nums.every(isEven));
[b]3.some迭代器[/b] some方法也是接受一个返回值为布尔类型的函数,只要有一个元素使得该函数返回true,该方法就返回true
//some迭代器
function isEven(num){
  return num % 2 == 0;
}
var nums = [1,3,5,7];
document.write(nums.some(isEven));
[b]4.reduce迭代器[/b] 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);
[b]得到的结果是:55[/b] [code]reduce()[/code]函数和[code]add()[/code]函数一起,从左到右,一次对数组中的元素求和,执行过程如下:
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
[code]reduce[/code]方法也可以用来将数组中的元素链接成一个长的字符串,代码如下
//使用reduce连接数组元素
function concat(accumulatedString, item){
  return accumulatedString + item;
}
var words = ['the ', 'quick ', 'brown ', 'fox'];
var sentence = words.reduce(concat);
document.write(sentence);
[b]最后输出结果如下:[/b] [img]http://files.jb51.net/file_images/article/201608/2016081610212616.png[/img] javascript还提供了[code]reduceRight[/code]方法,和[code]Reduce[/code]方法不同,它是从右到左执行,如下:
//使用reduce连接数组元素
function concat(accumulatedString, item){
  return accumulatedString + item;
}
var words = ['the ', 'quick ', 'brown ', 'fox '];
var sentence = words.reduceRight(concat);
document.write(sentence);
[b]执行结果如下:[/b] [img]http://files.jb51.net/file_images/article/201608/2016081610212617.png[/img] [b]5.map迭代器[/b] 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);
[b]输出结果:[/b] [img]http://files.jb51.net/file_images/article/201608/2016081610212718.png[/img] [b]6.fiter迭代器[/b] 和every迭代器类似,传入一个返回值为布尔类型的函数,和[code]every[/code]方法不同的是,当数组中所有元素对应该函数返回的结果均为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);
[b]输出结果如下:[/b] [img]http://files.jb51.net/file_images/article/201608/2016081610212719.png[/img] [b]总结[/b] 以上就是关于javascript中的六种迭代器的总结,希望本文的内容对大家学习工作能有所帮助。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部