您的位置:

JS中for循环的多种写法

JS是一种字符型脚本语言,常见于网页和node.js这类技术中。for循环是JS中最常用的循环语句之一,它可以让程序代码在满足一定条件下重复执行某个代码块。本文将介绍for循环的多种写法,和这些写法的应用场景,希望能给读者提供一些有帮助的知识。

一、基本写法

1、for循环的语法

for循环的语法如下:
for (初始值; 终止条件; 每次循环执行的语句) {
  需要重复执行的代码块
}
其中,初始值是指起始条件,终止条件是指终止循环的条件,每次循环执行的语句是指在每次循环结束后需要执行的语句。需要执行的代码块则是需要重复执行的代码。

2、代码示例

代码示例:
for (let i = 0; i < 10; i++) {
  console.log(i);
}
输出结果为:
0
1
2
3
4
5
6
7
8
9

3、应用场景

基本写法的for循环适用于大部分循环场景。在循环中可以通过初始值、终止条件和每次循环执行的语句完全控制循环的逻辑和重复执行的代码。

二、倒序循环

1、倒序循环的语法

要实现倒序循环,需要将初始值设为比较大的数,终止条件设为比较小的数,每次循环执行的语句需要将计数器减 1。代码示例如下:
for (let i = 10; i > 0; i--) {
  console.log(i);
}
输出结果为:
10
9
8
7
6
5
4
3
2
1

2、代码示例

代码示例:
for (let i = 10; i > 0; i--) {
  console.log(i);
}
输出结果为:
10
9
8
7
6
5
4
3
2
1

3、应用场景

倒序循环适用于需要从大到小循环遍历的场景,比如寻找数组中的最大值,或者数组逆序遍历等。

三、遍历数组

1、遍历数组的语法

JS中的数组可以通过for循环进行遍历。数组的长度可以通过数组的length属性获取。
let arr = [1, 2, 3, 4, 5];
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}
输出结果为:
1
2
3
4
5

2、代码示例

代码示例:
let arr = [1, 2, 3, 4, 5];
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}
输出结果为:
1
2
3
4
5

3、应用场景

遍历数组适用于遍历数组的场景,比如统计数组中的元素个数、计算数组的总和、查找数组中的某个元素等。

四、遍历对象

1、遍历对象的语法

JS中的对象可以通过for-in循环进行遍历。for-in循环会遍历对象的所有属性。
let obj = {name: 'John', age: 25};
for (let key in obj) {
  console.log(key + ': ' + obj[key]);
}
输出结果为:
name: John
age: 25

2、代码示例

代码示例:
let obj = {name: 'John', age: 25};
for (let key in obj) {
  console.log(key + ': ' + obj[key]);
}
输出结果为:
name: John
age: 25

3、应用场景

遍历对象适用于遍历对象的场景,比如统计对象中属性的个数、筛选符合条件的属性等。

五、嵌套循环

1、嵌套循环的语法

JS中的for循环可以嵌套使用,实现多重循环的效果。嵌套循环的语法如下:
for (let i = 0; i < 5; i++) {
  for (let j = 0; j < 3; j++) {
    console.log(i, j);
  }
}
输出结果为:
0 0
0 1
0 2
1 0
1 1
1 2
2 0
2 1
2 2
3 0
3 1
3 2
4 0
4 1
4 2

2、代码示例

代码示例:
for (let i = 0; i < 5; i++) {
  for (let j = 0; j < 3; j++) {
    console.log(i, j);
  }
}
输出结果为:
0 0
0 1
0 2
1 0
1 1
1 2
2 0
2 1
2 2
3 0
3 1
3 2
4 0
4 1
4 2

3、应用场景

嵌套循环适用于多维数据结构的遍历场景,比如遍历矩阵、地图等。

六、for-of循环

1、for-of循环的语法

JS中的for-of循环是ES6中新增的循环结构。for-of循环可以遍历数组和类数组对象(比如字符串、Set对象、Map对象等)。
let arr = [1, 2, 3, 4, 5];
for (let value of arr) {
  console.log(value);
}
输出结果为:
1
2
3
4
5

2、代码示例

代码示例:
let arr = [1, 2, 3, 4, 5];
for (let value of arr) {
  console.log(value);
}
输出结果为:
1
2
3
4
5

3、应用场景

for-of循环适用于遍历数组和类数组对象的场景,比如遍历字符串、遍历Set对象等。

七、for-await循环

1、for-await循环的语法

JS中的for-await循环是ES8中新增的循环结构。for-await循环可以遍历异步迭代器。
async function asyncFunc() {
  let arr = [1, 2, 3, 4, 5];
  for await (let value of arr) {
    console.log(value);
  }
}
输出结果为:
1
2
3
4
5

2、代码示例

代码示例:
async function asyncFunc() {
  let arr = [1, 2, 3, 4, 5];
  for await (let value of arr) {
    console.log(value);
  }
}
输出结果为:
1
2
3
4
5

3、应用场景

for-await循环适用于遍历异步迭代器的场景,比如遍历stream等异步数据源。

八、总结

本文介绍了JS中for循环的多种写法,并且对这些写法的应用场景做了详细的解释。使用这些写法可以更加灵活地处理各种不同的循环场景,提高程序的执行效率。
JS中for循环的多种写法

2023-05-19
js的for循环跟php循环,php中的for循环

本文目录一览: 1、js如何循环处理php从数据库循环出来的多个数组啊 2、js 的for里面嵌套php的如何在里面放置自增 i 3、js数组如何调用php数据库数组循环显示 4、php 的for循环

2023-12-08
JS for循环的多方面详解

2023-05-20
详解JavaScript中的for循环

2023-05-20
重学java笔记,java笔记总结

2022-11-23
js高级程序设计笔记14(js高级程序设计笔记14页)

本文目录一览: 1、JavaScript高级程序设计 该怎么看 2、JavaScript学习笔记之数组基本操作示例 3、JS中有关sort以及return的问题 JavaScript高级程序设计 该怎

2023-12-08
java方法整理笔记(java总结)

2022-11-08
java中的几种for循环形式,java for循环的特点

2022-11-20
python的用法笔记本(笔记本学python)

2022-11-16
最新python学习笔记3,python基础笔记

2022-11-17
Java for(;;) 循环用法

2023-05-11
js死循环的代码怎么写是什么(js中什么是死循环)

本文目录一览: 1、帮忙看一下这个js代码哪里写错了,死循环了? 2、js代码死循环怎么解决 3、JavaScript里面的死循环是什么意思?能否举个简单例子?谢谢 4、javascript一直弹对话

2023-12-08
java的for循环,java的for循环怎么写

2023-01-09
javascript简要笔记,JavaScript读书笔记

2022-11-17
印象笔记记录java学习(Java成长笔记)

2022-11-12
htmljs编程笔记(html代码笔记)

本文目录一览: 1、html代码和JS代码有什么区别 2、如何在html中调用js函数 3、JavaScript学习笔记之数组基本操作示例 4、HTML5初学者笔记 5、《web前端笔记7》js字符—

2023-12-08
java中for,java中for循环和while循环的区别

2023-01-03
python基础学习整理笔记,Python课堂笔记

2022-11-21
从多个方面详解JS退出for循环

2023-05-22
JS双重for循环详解

2023-05-19