# 流程控制

# if/else

当条件为真时执行表达式代码块

let state = true;
if (true) {
  console.log("表达式成立");
}

// 当state 为false时
if (!state) {
  // do somrthing
}

如果只有一条代码块,可以不用写 {}

var a = 1,
  b = 2;
if (a > b) console.log("a>b");
else console.log("a<b");
// a<b

# if/else if

function checkstate(val) {
  if (val == 0) {
    return "使用中";
  } else if (val == 1) {
    return "制作中";
  } else if (val == 2) {
    return "已停用中";
  } else {
    return "";
  }
}

# 三元表达式

(name=="Tom"? "hello Tom" : "hello unknow person";

这个语句可以理解为 : 如果名字是 Tom,则"hello Tom" ,否则 "hello unknow person"

# switch

可以将 switch 理解为 if 的另一种结构清晰的写法。

  • 如果表达式等于case 中的值,将执行此 case 代码段
  • break 关键字会终止 switch 的执行
  • 没有任何 case匹配时将执行default 代码块
  • 如果case执行后缺少break则接着执行后面的语句
let name = "视频";
switch (name) {
  case "产品":
    console.log(`name : ${name}`);
    break;
  case "视频":
    console.log(`name : ${name}`);
    break;
  default:
    console.log(`name : ${name}`);
}
// name : 视频

case 合用示例

let error = "warning";
switch (error) {
  case "notice":
  case "warning":
    console.log("警告或提示信息");
    break;
  case "error":
    console.log("错误信息");
}
// 当error 为warning/notice  输出 警告或提示信息

在 switch 与 case 都可以使用表达式

function message(age) {
  switch (true) {
    case age < 15:
      console.log("儿童");
      break;
    case age < 25:
      console.log("青少年");
      break;
    case age < 40:
      console.log("青年");
      break;
    case age < 60:
      console.log("中年");
      break;
    case age < 100:
      console.log("老年");
      break;
    default:
      console.log("年龄输出错误");
  }
}
message(10);

下面例子缺少 break 后,会接着执行后面的 switch 代码。

switch (1) {
  case 1:
    console.log(1);
  case 2:
    console.log(2);
  default:
    console.log("default");
}
// 1 2 default

# while

循环执行语句,需要设置跳出循环的条件否则会陷入死循环状态。

let num = 5;
while (num-- != 0) {
  console.log(num);
}
// 4 3 2 1 0

# do/while

后条件判断语句,无论条件是否为真都会先进行循环体。

var n = 0;
do {
  n++;
  console.log(n);
} while (n < 10);
// 1,2,3,4,5,6,7,8,9,10

# for

可以在循环前初始化初始计算变量。

打印倒三角的示例

for (let i = 10; i > 0; i--) {
  for (let n = 0; n < i; n++) {
    document.write("*");
  }
  document.write("<br/>");
}

# break/continue

break 用于退出当前循环,continue 用于退出当前循环返回循环起始继续执行。

获取所有偶数,所有奇数使用 continue 跳过

for (let i = 1; i <= 10; i++) {
  if (i % 2) continue;
  console.log(i);
}

获取三个奇数,超过时使用 break 退出循环

let count = 0,
  num = 3;
for (let i = 1; i <= 10; i++) {
  if (i % 2) {
    console.log(i);
    if (++count == num) break;
  }
}

# label

标签(label) 为程序定义位置,可以使用 continue/break 跳到该位置。

下面取 i+n 大于 15 时退出循环

lable1: for (let i = 1; i <= 10; i++) {
  lable2: for (let n = 1; n <= 10; n++) {
    if (n % 2 != 0) {
      continue lable2;
    }
    console.log(i, n);
    if (i + n > 15) {
      break lable1;
    }
  }
}

# for/in

用于遍历对象的所有属性,for/in主要用于遍历对象

不建议用来遍历数组。

let jsArr = [
    {title:"String",category:"基本数据类型"},
    {title:"Object",category:"引用类型"},
    {title:"undefined",category:"基本数据类型"},
    {title:"var",category:"变量"},
    {title:"const",category:"常量"}
]

for(const key in jsArr){
    console.log(jsArr[key].title);
}

# for/of

for/in不同的是for/of每次循环取其中的值而不是索引

let jsArr = [
    {title:"String",category:"基本数据类型"},
    {title:"Object",category:"引用类型"},
    {title:"undefined",category:"基本数据类型"},
    {title:"var",category:"变量"},
    {title:"const",category:"常量"}
]

for(const item of jsArr){
    console.log(item.title);
}

使用迭代特性遍历数组

const jsArr = ["js数据结构", "Es6解密"];

for (const [key, value] of jsArr.entries()) {
  console.log(key, value); //这样就可以遍历了
}

// 0  "js数据结构"
// 1  "Es6解密"
Last Updated: 3/6/2022, 3:39:54 PM