JavaScrip基础（二）：分支结构&循环结构

分支结构#

• if 语句
  当条件满足时，运行语句
  当条件不满足时，不运行语句
• if...else 语句
  当条件满足时，运行语句
  当条件不满足时，运行其他语句
• if...else if....else 语句
  使用该语句来选择多个代码块之一来执行
• switch 语句
  使用该语句来选择多个代码块之一来执行

if 语句#

语法

Copy
if (条件)
{
    语句块;
}

if...else 语句#

语法

Copy
if (条件){
    语句块1;
}
else{
    语句块2;
}

if...else if...else 语句#

语法

Copy
if (条件1)
{
    当条件 1 为 true 时执行的代码
}
else if (条件2)
{
    当条件 2 为 true 时执行的代码
}
else
{
  当条件 1 和 条件 2 都不为 true 时执行的代码
}

注：最后的else可以选择性添加

switch 语句#

语法

Copy
switch(n)
{
    case 1:
        执行代码块 1
        break;
    case 2:
        执行代码块 2
        break;
    default:
        与 case 1 和 case 2 不同时执行的代码
}

例子

Copy
显示今天的星期名称。请注意 Sunday=0, Monday=1, Tuesday=2, 等等：

var d=new Date().getDay(); 
switch (d) 
{ 
  case 0:x="今天是星期日"; 
  break; 
  case 1:x="今天是星期一"; 
  break; 
  case 2:x="今天是星期二"; 
  break; 
  case 3:x="今天是星期三"; 
  break; 
  case 4:x="今天是星期四"; 
  break; 
  case 5:x="今天是星期五"; 
  break; 
  case 6:x="今天是星期六"; 
  break; 
}

x 的运行结果：

今天是星期一

default 关键词#

使用 default 关键词来规定匹配不存在时做的事情

例子

Copy
如果今天不是星期六或星期日，则会输出默认的消息：

var d=new Date().getDay();
switch (d)
{
    case 6:x="今天是星期六";
    break;
    case 0:x="今天是星期日";
    break;
    default:
    x="期待周末";
}
document.getElementById("demo").innerHTML=x;

x 的运行结果：

期待周末

工作原理：首先设置表达式 n（通常是一个变量）。随后表达式的值会与结构中的每个 case 的值做比较。如果存在匹配，则与该 case 关联的代码块会被执行。碰到break，则结束执行，否则继续向下执行。可以使用 default 关键词来规定匹配不存在时做的事情。

结束机制

1. 碰到break结束
2. 整个结构都执行完毕

switch-case和if-else的区别

• if-else可以判定相等或不等的情形，适用性更广
• switch-caseswitch-case结构更清晰，效率更高；但一般用于指定变量相等于某个范围内的某个特定的值。

循环结构#

1. 什么是循环结构
   反复一遍遍做着相同的事

2. 循环中的两大要素

   1. 循环条件：什么时候开始，什么时候结束
   2. 循环操作：循环体，循环过程中干了什么

3. JavaScript 支持不同类型的循环：

   • for - 循环代码块一定的次数
   • for-in - 循环遍历对象的属性
   • while - 当指定的条件为 true 时循环指定的代码块
   • do-while - 同样当指定的条件为 true 时循环指定的代码块

while循环#

语法

Copy
while(boolean表达式){
    循环体语句;
}

流程：
1.判断条件
2.如果条件为真，则执行循环操作
3.再判断条件，如果为真则继续执行循环操作
...
n.判断循环条件，如果条件为假，则退出循环结构

注：如果循环条件一直为真的话，那么循环就是个死循环，尽量避免死循环的产生。

例子

Copy
var i=0;
while(i<10){
    console.log('hello');
    i++;
}

do-while循环#

语法

Copy
do{
    可执行语句;
}while(boolean表达式);

流程
1、先执行循环操作
2、再判断循环条件
如果条件为真，则继续执行循环操作
如果条件为假，则终止循环即退出循环

特点
无论条件满足与否，至少要执行一次循环操作

for循环#

语法

Copy
for(表达式1;表达式2;表达式3){
    循环体语句;
}

流程
1、计算表达式1的值
2、计算表达式2(boolean表达式)的值，如果为true则执行循环体，否则退出循环体；
3、执行循环体；
4、执行表达式3；
5、计算表达式2.如果为true则执行循环体，否则退出循环；
6、如此循环往复，直到表达式2的值为false

例子

Copy
for(var i=0;i<10;i++)
    console.log(i);
    
结果
0 1 2 3 4 5 6 7 8 9

表达式1#

• 通常会使用表达式1初始化循环中所用的变量 (var i=0)。
• 是可选的，不使用表达式1也可以
  例子

Copy
var i=2,len=cars.length;
for (; i<len; i++)
{ 
    document.write(cars[i] + "<br>");
}

• 可以在表达式1中初始化任意（或者多个）值
  例子

Copy
for (var i=0,len=cars.length; i<len; i++)
{ 
    document.write(cars[i] + "<br>");
}

表达式2#

• 同样是可选的
• 如果省略了表达式2，那么必须在循环内提供break。否则循环就无法停下来。

表达式3#

• 通常用于增加初始变量的值。
• 也可以省略（比如当循环内部有相应的代码时）：
  例子

Copy
var i=0,len=cars.length;
for (; i<len; )
{ 
    document.write(cars[i] + "<br>");
    i++;
}

for-in循环#

Copy
var person={fname:"Bill",lname:"Gates",age:56}; 
 
for (x in person) 
{
    txt=txt + person[x];
}

for，while，do-while之间的区别#

1、for：最少执行0次、多数用于确定循环次数时使用
2、while：最少执行0次、多数用于不确定循环次数时使用
3、do-while：最少执行1次、适合用于不确定循环次数时使用

break 和continue#

break ：用在循环中，终止整个循环。

continue：用在循环中，用于终止本次循环，继续执行下次循环