循环语句是什么
循环语句就是重复执行指定语句。js有5种循环语句：
- while
- Do / while
- for
- For / of
- For / in
最常见的用途就是迭代数组。
计数器变量
循环就是重复做。但是程序是如何实现重复做的呢？它的实现原理是什么？
先看一个例子
for ( let count = 0; count < 5; count++){
console.log(count)
}
-
let count = 0初始化变量 => 循环的起点 -
count < 5检测变量 => 循环的终点，控制是否执行循环体。 -
count++更新变量 => 控制循环迭代
这个变量被称为“计数器变量”或"循环变量"。大多数循环都有某种形式的计数器变量。记住：
对循环变量的三个关键操作
初始化
检测
更新
计数器变量在：
循环开始前：计数器变量会被初始化
循环迭代前：会测试计数器变量的值
循环结束时：更新计数器变量
while循环
定义
while循环是先测试循环表达式的循环。（while 语句创建一个循环，测试循环表达式
的结果为真时重复执行语句）
语法
initialize
while ( expression ){ //循环表达式
statement //循环体
increment //必须是由副作用的表达式，如赋值或++、--
}
- while: 引入循环表达式||标记循环结束
- Expression : 循环表达式
- 如果是假值则解析器会跳过循环体，这意味着循环体可能一次都不会执行。
- 如果是真值，则解析器会执行语句，然后再次求值表达式。
- statement：循环体
示例
let n = 0;
while (n < 3) {
n++;
}
console.log(n);// expected output: 3
注意事项
- while循环只会重复执行表达式后面的一条语句
let n = 10
while ( --n > 0)
console.log('hello' + n)
console.log('hi')
- 求值表达式必须要计算出fasle，否则while(true)会创造一个死循环
let count = 0 //①变量count从0开始
while ( count < 10 ){ //②表达式求值为true就执行循环体④再次求值表达式
console.log( count )
count++ //③每运行一次循环体count就增一次
}
- 常见的计数器变量的名字有:
count、i、j、k
do / while
do / while 循环后测试循环表达式的循环。这意味着循环体至少会执行一次。
语法
do
statement
while ( expression );
do {
statement
} while ( expression );
- do: 标记循环开始
- statement： 循环体
- while： 标记循环结束||引入循环表达式
- expression: 循环表达式
示例
let result = '';
let i = 0;
do {
i = i + 1;
result = result + i;
} while (i < 5);
console.log(result);
// expected result: "12345"
for循环
语法
for ( 变量声明; 条件表达式; 赋值表达式){
//循环体
}
- 变量声明：在循环开始前设置的普通变量，通常是一个数，用于设置循环的起点。
- 条件表达式：控制是否执行循环体，也就是指定循环的终点。
- 赋值表达式：每次循环体执行后执行的代码，用于更新计数器变量的值。（必须是由副作用的表达式）
示例：
for ( let i = 0; i < 5; i++){
console.log(i)
}
-
let i = 0初始化计数器变量，在循环开始前执行，且只执行一次。 -
i < 5检测计数器变量，求值结果为真则执行循环体，否则跳过循环体。 -
i++更新计数器变量 - 重复步骤2
作业
-
写一个水果超市的价格查询程序： 苹果 香蕉 火龙果 橙子 榴莲等
输入一个“苹果” 返回=> 3.6 / 斤
使用prompt()设置行数、列数、和符号输出下面的图形
*****
*****
*****
*****
*****
-
向控制台输出一个口字形状的星号
***** * * * * * * ***** -
向控制台输出下面的图形
* ** *** **** ***** -
向控制台输出下面的图形
***** **** *** ** * 向控制台输出下面的图形
*
**
***
****
*****
- 向控制台输出下面的图形
*****
****
***
**
*
- 向控制台输出下面的图形
*
**
* *
* *
* *
******
- 向控制台输出下面的图形
*
***
*****
*******
*********
- 向控制台输出下面的图形
*********
*******
*****
***
*
- 向控制台输出下面的图形
*
* *
* *
* *
*********
- 向控制台输出下面的图形
*
***
*****
*******
*********
*******
*****
***
*
- 向控制台输出下面的图形
*
* *
* *
* *
* *
* *
* *
* *
*
- 向控制台输出下面的图形
*********
*******
*****
***
*
***
*****
*******
*********
- 向控制台输出下面的图形
*
**
***
****
*****
****
***
**
*
- 向控制台输出下面的图形
*
**
***
****
*****
****
***
**
*
- 向控制台输出下面的图形
*** ***
***** *****
***********
*********
*******
*****
***
*
