WTF JavaScript 教程,帮助新人快速入门 JavaScript。
推特:@WTFAcademy_ | @0xAA_Science
WTF Academy 社群: 官网 wtf.academy | WTF Solidity 教程 | discord | 微信群申请
所有代码和教程开源在 github: github.com/WTFAcademy/WTF-JavaScript
这一讲,我们介绍 JavaScript 中的循环语句,我们经常需要重复执行一些操作,比如将列表中的商品逐个输出,循环提供了一种快速和简单的方式去重复执行某些操作,它有多种形式。
while 语句包括一个循环条件和一段代码块,只要条件为真,就不断循环执行代码块。它的基本结构如下:
while (条件) {
语句
}例如,下面的例子将循环 3 次,直到 i 等于 3 为止:
let i = 0
while (i < 3) {
console.log(`i 当前的值为:${i}`)
i++
}
// i 当前的值为:0
// i 当前的值为:1
// i 当前的值为:2下面是一个无限循环的例子,因为循环条件总是为真:
while (true) {
console.log('Hello, WTF JavaScript')
}do...while 循环与while 循环类似,唯一的不同在于do...while 循环会首先执行循环体,然后检查条件,当条件为真时,重复执行循环体。其基本结构如下:
do {
语句
} while (条件)这种结构的特点是不管条件是否为真,循环体至少执行一次。将前面 while 循环中打印 i 的例子改成 do…while 循环如下:
let i = 0
do {
console.log(`i 当前的值为:${i}`)
i++
} while (i < 3)
// i 当前的值为:0
// i 当前的值为:1
// i 当前的值为:2for 循环是最常使用的循环形式,它可以指定循环的起点、终点和终止条件。其基本结构如下:
for (初始化表达式; 条件; 增量表达式) {
语句
}- 初始表达式:初始化一个或多个循环计数器,但语法上是允许一个任意复杂度的表达式的。这个表达式也可以声明变量。只在循环开始时执行一次。
- 条件表达式:每轮循环开始时,都会计算这个条件表达式的值,只有值为真,才继续进行循环。否则,停止循环。
- 增量表达式:每轮循环执行的最后一个操作,通常用来更新循环变量。
下面是循环打印 i 的例子:
for (let i = 0; i < 3; i++) {
console.log(`i 当前的值为:${i}`)
}
// i 当前的值为:0
// i 当前的值为:1
// i 当前的值为:2for 循环的任何语句段都可以被省略。如果全部被省略就会导致无限循环:
for (;;) {
console.log('Hello, WTF JavaScript')
}break 语句用于跳出代码块或循环。
let i = 0
while (i < 3) {
console.log(`i 当前的值为:${i}`)
i++
if (i === 2) break
}
// i 当前的值为:0
// i 当前的值为:1上面的例子只会执行两次循环,当 i 等于 2 时,就会跳出循环。改写成 for 循环如下:
for (let i = 0; i < 3; i++) {
if (i === 2) break
console.log(`i 当前的值为:${i}`)
}
// i 当前的值为:0
// i 当前的值为:1continue 语句也用于跳出循环,与 break 语句不同的是,它不会中止整个循环,而是立即终止本轮循环,返回循环结构的头部,开始下一轮循环。下面是一个打印奇数的例子:
for (let i = 0; i < 10; i++) {
if (i % 2 == 0) continue
console.log(`i 当前的值为:${i}`)
}
// i 当前的值为:1
// i 当前的值为:3
// i 当前的值为:5
// i 当前的值为:7
// i 当前的值为:9一个 label 提供了一个让你在程序中其他位置引用它的标识符。其基本结构如下:
label: 语句label 的值可以是任何的非保留字的 JavaScript 标识符,语句可以是任意你想要标识的语句(块)。例如,你可以用 label 标识一个循环,然后使用 break 或者 continue 来指出程序是否该停止循环还是继续循环。
未添加 label:
let n = 0
for (let i = 0; i < 10; i++) {
// i 循环
for (let j = 0; j < 10; j++) {
// j 循环
if (i === 5 && j === 5) {
break // i = 5,j = 5 时,会跳出 j 循环,但 i 循环会继续执行
}
n++
}
}
console.log(n) // 95添加 label 后:
let n = 0
outPoint: for (let i = 0; i < 10; i++) {
// i 循环
for (let j = 0; j < 10; j++) {
// j 循环
if (i === 5 && j === 5) {
break outPoint // 在 i = 5,j = 5 时,跳出所有循环,返回到整个 outPoint 下方,继续执行
}
n++
}
}
console.log(n) // 55使用任意循环输出 10 以内的偶数。
function TestJS07(props) {
}这一讲我们介绍了 JavaScript 的循环语句。主要讲解了主要讲解了 while 和 for 两种循环结构,以及跳出循环的方式。