常见遍历方法 for循环、forEach、map、filter、find、findIndex、some、every

简介: 常见遍历方法 for循环、forEach、map、filter、find、findIndex、some、every

for循环

来自于远古的遍历方式,并且涵盖多种手段,例如for in 和for of。

for(let i = 1; i<=5; i++){
  console.log("这是第"+i+"次"+"循环")
}

for循环 中使用break和continue语句(终止和跳过本次循环):

for(let i=1;i<=10;i++){
  if(i==3){
    break;//跳出循环,执行循环后面的语句(整个循环便终止了)
  }
  console.log(i)
}
for(let i=1;i<=10;i++){
  if(i==3 || i==7 || i==9){
    continue;//中断循环中的迭代,然后继续循环中的下一个迭代
  }
  console.log(i)
}

for of 用来遍历数组也是可以的

for of 中也可以用break和continue

遍历对象: for in

let student = {name:"张三",sex:"男",age:18,hometown:"河南许昌"}
for(let x in student){
  console.log(x+":"+student[x]+)
}//x为key键  属性     student[x]为值 value

for in 也可以遍历数组,但不推荐

for in 中也可以用break和continue

forEach遍历

forEach是ES5中操作数组的一种方法,主要功能是遍历数组。

let arr = [1,2,3,4];
let sum = 0;
arr.forEach(function(value,index,array){
  array[index] == value;    //结果为true
  sum+=value;  
});
console.log(sum);    //结果为 10

forEach可以修改自己吗?

答:在数组每一项为引用类型时可以

let arr = [1,2,3,4,5,6]
arr.forEach((item) => {
  item = item +1
})
console.log(arr)//[1,2,3,4,5,6]
let objArr = [{num:1},{num:2}]
objArr.forEach((item) => {
  item.num +=1
})
console.log(objArr)//[{num:2},{num:3}]

完整见:https://blog.csdn.net/web2022050901/article/details/125002327

forEach不可以用break和continue

那forEach怎么跳出和终止循环呢?

forEach跳出:

var arr = [1,2,3,4,5,6]
arr.forEach((item) => {
  if (item === 3) {
    return
  }
    console.log(item)
})

将输出 1 2 4 5 6,3不会输出

forEach终止:(抛出异常的方式)

var arr = [1,2,3,4,5,6]
try{
  arr.forEach((item) => {
      if (item === 3) {
        throw new Error('End Loop')
      }
      console.log(item)
  })
} catch (e) {
    if(e.message === 'End Loop') throw e
}

将只输出 1 2

map

map即是 “映射”的意思 用法与 forEach 相似。

[].map(function(value,index,array){
  //code
})

MDN上说:map() 方法创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。具体使用如下:

let array = [1, 4, 9, 16];
const map1 = array.map(x => {
    return x + 1;
});
console.log(array)//[1,4,9,10.16]
console.log(map1)//[2,5,10,17]

可见map并不会修改原数组。

filter

filter用于对数组进行过滤,得到符合条件的新数组。

filter() 不会对空数组进行检测;不会改变原数组。

let nums = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let res = nums.filter((num) => {
  return num > 5;
});
console.log(res);  // [6, 7, 8, 9, 10]

find

find()方法用于查找数组中符合条件的第一个元素,如果没有符合条件的元素,则返回undefined。

let arr = [1, 2, 3, 4, 5];
let num = arr.find(item => {
  return item > 1
});
console.log(num)  //2

findIndex

findIndex方法常用来查找数组中满足条件的第一项元素的下标。

const arr = [1, 2, 3, 4, 5, 3, 3, 2, 4, 5 ]
let index = arr.findIndex(item => {
    return item > 2
})
console.log(index) // 2

some

some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。

some() 方法会依次执行数组的每个元素:

  • 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
  • 如果没有满足条件的元素,则返回false。

注意: some() 不会对空数组进行检测。

注意: some() 不会改变原始数组。

let data = ['1','2','3']
//一直在找符合条件的值,一旦找到,则不会继续迭代下去。
let re = data.some(function(item){
    // 只要判断做比较的变量是数组中有的就返回true
    return item === '1' // true
})
console.log(re)//true

与some()方法相反

every() 方法用于检测数组所有元素是否都符合指定条件(函数提供)。

every() 方法使用指定函数检测数组中的所有元素:


如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。

如果所有元素都满足条件,则返回 true。

注意: every() 不会对空数组进行检测。

注意: every() 不会改变原始数组。

let data=['1','2','3']
// every(function(){})是对数组中每一项运行给定函数,如果该函数对每    一项返回true,则返回true,
// 一旦有一个不符合条件,则不会继续迭代下去
let result = data.every(function(item){
    return item === '1'
})
console.log(result) // false
相关文章
|
25天前
|
Go
go语言中遍历映射(map)
go语言中遍历映射(map)
42 8
|
17天前
|
Go
go语言for遍历映射(map)
go语言for遍历映射(map)
29 12
|
1月前
|
存储
`map()`方法在什么场景下会比 `forEach()`方法更高效?
综上所述,当需要对数组元素进行复杂的转换并生成新数组、进行链式调用和函数式编程、处理元素之间存在明确映射关系的情况以及与其他数组方法结合使用时,`map()`方法比`forEach()`方法更高效,能够使代码更加简洁、清晰和易于维护。
57 32
|
21天前
|
存储 Go
go语言 遍历映射(map)
go语言 遍历映射(map)
32 2
|
1月前
|
存储 JavaScript 前端开发
如何选择使用`map()`方法和`forEach()`方法?
选择使用`map()`方法还是`forEach()`方法主要取决于操作的目的、是否需要返回值、代码的可读性和维护性等因素。在实际开发中,需要根据具体的业务需求和场景来灵活选择合适的方法,以实现更高效、更易读和更易维护的代码。
26 3
|
6月前
|
Dart
Dart之集合详解(List、Set、Map)
Dart之集合详解(List、Set、Map)
|
3月前
|
Go 定位技术 索引
Go 语言Map(集合) | 19
Go 语言Map(集合) | 19
|
3月前
|
存储 前端开发 API
ES6的Set和Map你都知道吗?一文了解集合和字典在前端中的应用
该文章详细介绍了ES6中Set和Map数据结构的特性和使用方法,并探讨了它们在前端开发中的具体应用,包括如何利用这些数据结构来解决常见的编程问题。
ES6的Set和Map你都知道吗?一文了解集合和字典在前端中的应用
|
4月前
|
存储 安全 Java
java集合框架复习----(4)Map、List、set
这篇文章是Java集合框架的复习总结,重点介绍了Map集合的特点和HashMap的使用,以及Collections工具类的使用示例,同时回顾了List、Set和Map集合的概念和特点,以及Collection工具类的作用。
java集合框架复习----(4)Map、List、set
|
4月前
|
Java
【Java集合类面试二十二】、Map和Set有什么区别?
该CSDN博客文章讨论了Map和Set的区别,但提供的内容摘要并未直接解释这两种集合类型的差异。通常,Map是一种键值对集合,提供通过键快速检索值的能力,而Set是一个不允许重复元素的集合。