循环语句可以在满足条件的情况下重复执行相同的代码,JavaScript中的循环语句包括for、for...of、while、do...while。此外,使用try语句还可以捕捉和处理代码执行过程中的错误。本文将介绍JavaScript循环语句中和try语句的应用。
for语句适用于可确定循环次数的场景,如计算1到100的和,其应用结构如下。
for(<初始化循环控制变量>; <条件>; <改变控制变量的值>) { <循环语句> }
其中,<初始化循环控制变量>需要定义循环控制变量并设置初始值;<条件>指定执行<循环语句>的条件,当条件为true时会执行循环语句,条件不成立时退出for语句结构;<改变控制变量的值>指定每次执行循环语句后,循环控制变量值的改变,请注意,如果条件满足,而循环控制变量的值又没有变化,则会无限循环,也就是常说的“死循环”。
下面的代码演示了使用for语句计算1到100的累加。
<script> let sum = 0; for (let i = 1; i <= 100; i++) { sum += i; } alert(sum); </script>
执行结果会显示5050。代码中,首先定义变量sum,用于保存累加的和,初始值为0。for语句结构中,定义循环控制变量i,初始值为1,同时也是累加的数值;执行循环的条件是当i小于等于100时,当i大于100时会退出循环;每次执行循环语句后执行i++,即i的值加1。循环语句中使用“sum+=1”,即将i的当前值累加到sum中。这里使用了两个新的运算符,++和+=,下面分别介绍。
++称为自增量运算符,--称为自减量运算符,分别进行变量的加1和减1操作。此外,++和--运算符可以放在变量前,也可以放在变量后,下面的代码以++运算符为例。
<script> let i = 10; alert(i++); // 10 alert(i); // 11 </script>
++运算符放在变量后时,i++表达式的值是i的原始值,即先返回i的值再进行i+1的操作。而++放在变量之前,如++i会先进行i+1的操作,表达式的值即是i+1后的结果,如下面的代码。
<script> let i = 10; alert(++i); // 11 alert(i); // 11 </script>
如果只使用自增后变量i的值,则++运算符在变量之前或之后并无区别,如果使用++运算表达式的值,则需要区别前增量和后增量计算的区别。
--运算符的工作原理与++运算符相似,只不过进行的减1的操作,如下面的代码,会使用--运算符计算100到1的和。
<script> let sum = 0; for (let i = 100; i >= 1; i--) { sum = sum += i; } alert(sum); // 5050 </script>
执行代码会显示5050。
复合赋值运算符是计算和赋值运算符的组合,如sum+=i就相当于sum=sum+i。在JavaScript中,算术运算、位运算都有对应的复合赋值运算符,下面的代码演示了**=和<<=运算符的应用。
<script> let n = 2; alert(n **= 3); // 8 alert(n <<= 2); // 32 </script>
代码中,首先定义变量n,并赋值为2;第一个alert()函数调用中,使用n**=3计算了n=n**3,即求n的3次方,并将计算结果保存到n中,运算表达式的值即n的值,显示为8;第二个alert()函数调用,使用n<<=2计算n=n<<2,即n左移2位,计算n乘以2的2次方,计算结果保存到变量n,显示为32。
for...of语句用于依次访问集合中的元素,应用格式如下:
for(<元素变量> of <集合>) { <语句> }
下面的代码演示了如何依次访问数组(Array)中的元素。
<script> let arr = [1, 2, 3, 5, 8]; for (let n of arr) { alert(n); } </script>
代码会通过消息对话框依次显示arr数组中的元素1、2、3、5、8。
while语句会根据指定的条件重复执行语句,应用格式如下:
while(<条件>) { <语句> }
结构中,当<条件>成立时执行<语句>,当条件不成立时退出while语句结构;请注意,在<语句>中应该有改变循环条件的语句,否则会陷入无限循环(死循环)。
下面的代码会使用while循环计算1到100的累加。
<script> let i = 1, sum = 0; while (i <= 100) { sum += i; i++; } alert(sum); </script>
执行代码会显示5050。本例,首先定义了两个变量,变量i为加数,同时也是循环条件,初始值为1;变量sum用于保存累加的和,初始值为0。while循环中,首先将i的值累加到sum中,然后i会加1,从而改变循环条件。当i的值小于或等于100时,会持续累加,当i大于100时则退出循环,并通过消息对话框显示sum的值。
do...while语句与while语句功能相似,不同点在于,while语句是在每次循环之前判断条件,而do...while则是在每次循环之后判断条件,应用格式如下。
do { <语句> } while(<条件>);
下面的代码会使用do...while语句重写1到100的累加。
<script> let i = 1, sum = 0; do { sum += i; i++; } while (i <= 100); alert(sum); </script>
需要注意的是,do...while至少会执行一次循环语句,此时,代码需要确保首次执行的条件是成立的,并且所有数据和资源都是正确的,否则在循环语句中可能会出现执行错误。一般来讲,使用while语句先对循环条件进行判断是更常见的编程方法。
在switch语句结构中,break语句用于在case或default结构中退出switch语句;各种循环语句结构中,在满足某种条件时,也可以使用break语句直接退出循环,如下面的代码用于判断一个整数是否为质数(素数)。
<script> // 判断n是否为质数 let n = 11; let result = true; if (n < 2) { result = false; } else { let m = Math.ceil(Math.sqrt(n)); for (let i = 2; i <= m; i++) { if (n % i === 0) { result = false; break; } } } // if (result) alert(`${n}是质数`); else alert(`${n}不是质数`); </script>
代码中,变量n为需要判断是否为质数的整数,变量result为判断结果,初始值为true,即假设是质数,而接下来的代码会在n不是质数时将result设置为false。for循环的控制变量i从2到n的平方根(向上取整),当n能够被i整除时,n就不是质数,此时将result设置为false,并使用break语句退出for循环。本例,可以修改n的值来观察运行结果。
continue语句的功能是在循环语句结构中满足条件时结束当前循环,当条件满足时执行下一次循环,如下面的代码演示了计算1到100中偶数的累加。
<script> let sum = 0; for (let i = 1; i <= 100; i++) { if (i % 2 === 1) continue; else sum += i; } alert(sum); </script>
执行代码会显示2550。
实际上,对于这种每次增加固定数值的循环,完全可以使用循环控制变量操作,如下面的代码。
<script> let sum = 0; for (let i = 2; i <= 100; i+=2) { sum += i; } alert(sum); </script>
代码中,循环控制变量从2开始,每次循环后使用i+=2,即i=i+2,这样会直接得到2到100中的偶数。执行代码同样会显示2550。
try语句结构可以在代码运行时捕捉错误,并对错误进行处理、进行资源清理等工作。try语句的基本结构如下:
try { <语句3> } catch(e) { <语句3> } finally { <语句3> }
结构中,<语句1>为主代码,其中可能会出现运行错误;代码执行过程中,当<语句1>出现错误时,会由catch语句捕捉错误,错误相关信息会保存在catch关键字后圆括号中的对象,在<语句2>中可以对错误进行处理,如提示错误信息和如何修正等;无论<语句1>是否有运行错误,finally中的<语句3>都会执行。
先来看一个简单的例子,如下面的代码。
<script> try { let x = 10, y = 0; let result = x / y; alert(result); } catch (ex) { alert(ex.name); } </script>
代码中,try语句中的变量y为0,当其为除数时就会出现错误,此时,错误信息会保存到catch关键字后圆括号中的ex对象,错误处理代码中使用alert()函数通过消息对话框显示错误信息。本例没有清理代码,可以省略finally部分。
下面的代码添加了finally语句部分。
<script> try { let x = 10, y = 0; let result = x / y; alert(result); } catch (ex) { alert(ex.name); } finally { alert("finally"); } </script>
本例,可以修改变量y的值来观察catch和finally代码的执行情况。