欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

JavaScript 之迭代方法

程序员文章站 2023-10-18 23:06:48
前言:关于 JS 中为数组定义的迭代方法,我最开始是在《JavaScript高级程序设计》中学习的,然后。。。我并没有看懂,后来翻阅各个大佬的博客,稍微理解了那么一丢丢。以下就是我的一点见解。 首先,我们需要知道数组中的迭代方法都有哪些,列举出来分别是:every、some、filter、map、f ......

前言:关于 js 中为数组定义的迭代方法,我最开始是在《javascript高级程序设计》中学习的,然后。。。我并没有看懂,后来翻阅各个大佬的博客,稍微理解了那么一丢丢。以下就是我的一点见解。

 

首先,我们需要知道数组中的迭代方法都有哪些,列举出来分别是:every、some、filter、map、foreach、reduce。

其中 every、some、filter、map、foreach 五种方法在传入时函数会接受三种参数,分别是 item(数组中项的值)、index(项的索引)、array(数组自身)。我在下面的案例中都只传入了两个值,原因是。。。用不到(其实是懒得写) 

而 reduce 方法则会接受四个参数,分别是 prev(前一个项)、cur(当前项)、index(项的索引)、array(数组对象),函数中返回的任何值都会作为第一个参数传给下一项,函数的迭代是在数组的第二项开始的。

 

1.every ------- 查询数组中的每一项是否满足条件

var num = [1,2,3,4,5];
var number = num.every(function(item,index){
      return (item > 3);   //判断传入的值是否全部都大于3
})
console.log(number);   //false  有一个不满足即为false

2.some ------- 查询数组中的每一项哪些满足条件

var num = [1,2,3,4,5];
var number = num.some(function(item,index){
      return (item > 3);   //判断传入的值哪些项大于3
})
console.log(number);   //true  满足一个即可为true

3.filter ------ 筛选符合条件的项,组成新数组

var num = [1,2,3,4,5];
var number = num.filter(function(item,index){
      return (item > 3);   //判断传入的值哪些项大于3
})
console.log(number);   //[4,5]

 4.map ------ 数组中的项通过计算,组成新数组

var num = [1,2,3,4,5];
var number = num.map(function(item,index){
      return item * 3;   //传入的数值都乘以3
})
console.log(number);   //[3,6,9,12,15]

5.foreach ------ 传入数组中的每一项

var num = [1,2,3,4,5];
var number = num.foreach(function(item,index){
      console.log(item);   // 1 2 3 4 5
})

    关于 foreach 我再多叨叨几句,这个方法在本质上与 for 循环没有什么区别。上面提到过,每个方法都会传入三个参数,那么我在输出时传入第一项,也就是输出数组中的每一项。如果传入第二项,则是循环迭代数组的 index 下标值,如果传入第三项,则是循环迭代整个 num 数组。

6.reduce ------ 数组的前项和后项进行累计值计算

var num = [1,2,3,4,5];
var number = num.reduce(function(prev,cur,index){
      return prev + cur;
})
console.log(number);   // 1+2+3+4+5 = 15 本质上就是数组中的项 累计运算的过程