JavaScript流程控制与循环遍历

JavaScript流程控制与循环遍历

一、流程控制

流程控制在一个程序执行的过程中，各条代码的执行顺序对程序的结果是有直接影响的。很多时候我们要通过控制代码的执行顺序来实现我们要完成的功能。流程控制主要有三种结构，分别是顺序结构、分支结构和循环结构，代表三种代码执行的顺序。

1、if…else、if…else if…else分支流程控制

 // 1. 条件成立执行的代码语句
  if (条件表达式) { 
  }
  // 2.if else 语句
  if (条件表达式) {
      // [如果] 条件成立执行的代码
  } else {
      // [否则] 执行的代码
  }
  // 3. if else if 语句(多分支语句)
  // 适合于检查多重条件。
  if (条件表达式1) {
      语句1；
  } else if (条件表达式2)  {
      语句2；
  } else if (条件表达式3)  {
     语句3；
   ....
  } else {
    // 上述条件都不成立执行此处代码
}

2、switch分支流程控制

switch( 表达式 ){ 
    case value1:
        // 表达式 等于 value1 时要执行的代码
        break;
    case value2:
        // 表达式 等于 value2 时要执行的代码
        break;
    default:
        // 表达式 不等于任何一个 value 时要执行的代码
}

3、三元表达式

//如果表达式1为 true ，则返回表达式2的值，如果表达式1为 false，则返回表达式3的值
  表达式1 ? 表达式2 : 表达式3;

二、循环与遍历

循环有二种: while(), for()
循环有三个要素:

1. 循环变量
2. 循环条件
3. 更新循环条件

1. while():入口循环, 进入循环前必须判断一次循环条件

const lang = ["html", "css", "js"];
let i = 0;
while (i < lang.length) {
    console.log(lang[i]);
    i = i + 1;
}

2、do-while(): 出口判断型, 所以条件不论是否满足, 都会执行一次循环体

i = 0;
do {
    console.log(lang[i]);
    i = i + 1;
} while (i > lang.length);//条件不满足，但还是会执行一次输出html

3、for ( 循环变量初始化; 循环条件; 更新循环条件)

for (let i = 0; i < lang.length; i++) {
    console.log(lang[i]);
}

4. for - of 遍历数组

for (item of lang){
    console.log(item);
}

5、forEach()遍历数组

lang.forEach(function (item, index, array) {
    console.log(item, index, array);
});
// 只有第一个参数:数组成员才是必须的
lang.forEach(function (item) {
    console.log(item);
});

6. for - in : 遍历对象

let user = { id: 1, "my name": "zhu", age: 18 };
//   for (属性/键名 in 对象) {}
for (let key in user) {
    console.log(user[key]);
}

「continue、break」

continue 关键字用于立即跳出本次循环，继续下一次循环（本次循环体中 continue 之后的代码就会少执行一次）。
break 关键字用于立即跳出整个循环（循环结束）。