JavaScript 流程控制

共有三种流程控制方式:

  • 顺序结构 – 顺序结构就是自上而下按顺序执行代码
  • 选择结构 – 选择结构就是根据条件判断从而执行某段代码
  • 循环结构 – 循环结构就是满足某个条件下重复执行某段代码

顺序结构就是最常见的按顺序执行代码。

选择结构

选择结构就是根据你设定的判断依据,当判断为 true 时进行某项选择,选择语句有「if」、「if…else」和「switch」

if

if 就是如果怎么样,if..else 就是如果怎么样不然就怎么样

单项选择:

let score = 100;
if (score > 60){
  console.log('你及格了')
} 

双向选择:

let score = 100;
if (score > 60){
  console.log('你及格了')
} else {
  console.log('你挂科了')
}

双向选择多了「else」,就是当「if」判断为 false 时执行些什么

多项选择:

let score = 80;
if (score > 90){
  alert('A');
} else if (score < 90 && score > 70){
  alert('B');
} else {
  alert('考砸啦')
}

除了使用「else」还可以使用「else if」再多判断一次

嵌套:

if(条件){
  if(条件){
  }
} else {
}

if 里面也可以套着 if 的

switch

switch就是「开关」,case就是「匹配」,break 就是「断开」,default 就是「默认」

let day = 3;
let week;
switch (day) {
  case 1:
    week = '星期一';
    break;
  case 2:
    week = '星期二';
    break;
  case 3:
    week = '星期三';
    break;
  default:
    week = '星期日'
}
console.log(week); // "星期三"

上面的例子简单来说就是 switch 判断 day 变量的值,如果 case 到和 day 也就是 3 一样的值时,就把 week 变量赋值「”星期三”」,并且 break 结束语局,如果都没有 case 到那么就默认走 default,default 的操作就是给 week 赋值「”星期日”」

let num = 5;
let car;
switch ( num ){
  case 1:
    car = "壹"
  case 3:
    car = "叁"
  case 5:
    car = "伍"
  default:
    car = "零"
}
console.log(car); // "零"

这是一个坑,因为没有 case 中断语句,所以一路执行到了最后的 default,这是使用 switch 时常见的坑

循环结构

循环结构就是当判断条件为 true 时循环执行某段代码,循环语句有「while」、「do…while」和「for」系列

while

let i = 1;
let sum = 0;
while (i <= 100){
  sum += i;
  i++;
}
console.log(sum); // 100

第一次执行时,i 小于100,sum = 0 + 1, i = 2…

第二次执行时,i 小于100,sum = 0 + 1 + 2, i = 3…

第三次执行时,i 小于100,sum = 0 + 1 + 3, i = 4…

直至 101 次循环时,while 判断 i 等于 101,所以推出了循环,这时打印 sum 的结果就是 100

do…while

let i = 1;
let sum = 0;
do {
  sum += i;
  i++;
} while (i <= 100);
console.log(sum); // 100

do…while 是首先无条件执行循环一次,再进行判断,如果判断条件成立,再循环,再判断…

for

for 的基本语法「for (初始化表达式;条件表达式;循环后操作){}」

初始化表达式表示用于计数的变量的初始值

条件表达式表示达到什么条件退出循环

循环后操作表示循环体({}花括号内的代码)执行完后做些什么操作

for (let i=0;i<5;i++){
  console.log(i)
}

也就是说以上操作中,i 一开始是 0 (初始化表达式),当小于 5 且不是 5 时(条件表达式)执行花括号内代码(也就是向控制台打印 i 的值),循环结束 i++ 后 i 变成 2,接着再依据条件表达式,这时还是小于 5 那么接着下一轮的循环。

Conners Hua

欢迎加入群聊: Telegram 群聊 | QQ 群聊(不讨论敏感话题)

您可能还喜欢...

发表评论

电子邮件地址不会被公开。 必填项已用*标注

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据