这是我参与8月更文挑战的第5天，活动详情查看：8月更文挑战

流程图

一套标准的图形，用于描述程序的逻辑。通常用于分析程序的流程图。主要的流程图有以下这写：

开始或者结束

graph TD
id1(开始或者结束)
id2([开始或者结束])
id5((开始或者结束))

用于表示一个流程的开始和结束，可以使用带圆角的长方形、椭圆或者圆形，一般用于流程的起点和结束

判断

graph TD
id4{判断}

菱形表示判断，用来表示是否的操作

流程中的步骤

graph TD
id3[流程中的步骤]

用长方形来表示流程中的步骤

输入或者输出

graph TD
id1[\输入或者输出\]

id2[/输入或者输出/]

id3[输入或者输出]

使用平行四边形或者长方形来表示流程中的输入或者输出

连接线

graph LR 
A-->|连接线| B

连接线表示两个流程的流向

if 判断

用法：

条件使用的是逻辑判断，如果为 false, undefined, null, ' ' , 0 为假外，其他都为真， 详情查看

if(条件1){
    // 如果条件1为真，执行这里面的代码块
}else if(条件2){
  // 如果条件2为真，执行这里面的代码块
}
... 可以写无穷个esle if

else{
 // 以上条件都不满足，执行这个代码块
}

细节

1. 如果满足某个条件，则字节忽略后面所有的条件
2. else if 的个数是 >=0 个的
3. else 可以有1个或者0个
4. else 可以换行，也可以不换行
5. 如果代码块只有一行语句，可以省略大括号

switch 开关

用法：

switch(表达式){
    case 数据1:
        代码块;
        break;
    case 数据2：
        代码块;
        barak;
     // ....
     default:
        代码块
        barak;
 }

计算表达式的返回值，依次运行case后面的数据进行严格相等来 做比较，只要有一个地方满足条件后会执行后面的所有代码，遇到break跳出循环，不会运行其他的语句。

循环

循环结构是用来进行重复执行代码的一种流程控制。主要有 while循环，do-while循环，for循环等

这里咋们做一个1 + 2 + …… + 100的案例

while循环

while(条件){
    // 代码块，循环体
}

graph LR
开始((开始)) --> 条件{条件}
条件--true--> 代码块
代码块 --> 条件
条件 --false --> 结束((结束))

var sum = 0, i = 1;
while(i<=100){
    sum += i;
    i ++;
}

console.log('whole循环，1+2 +…… + 100的结果是', sum)

死循环，当条件永远满足，代码午饭跳出循环，就会一直执行循环，知道内存溢出。浏览器卡死

do-while循环

用法

do{
   循环体
}while(条件)

graph LR
开始((开始))--> 代码块
代码块--> 条件{条件}
条件--true--> 代码块
条件--false--> 结束((结束))

var sum = 0, i = 1;
do{
    sum += i;
    i++
}while(i <= 100)

console.log('do-whole循环，1+2 +…… + 100的结果是', sum)

do-while 循环会先运行一遍循环体，然后在来做条件判断，while循环不会先运行循环体

for 循环

用法

for(初始化表达式; 条件; 条件改变表达式){
    代码块
}

graph LR
开始((开始))--> 初始化表达式
初始化表达式 --> 条件{条件}
条件--true--> 循环体
循环体--> 条件改变表达式
条件改变表达式 --> 条件
条件 --false --> 结束((结束))

var sum = 0;
for(var i = 1; i <= 100; i ++){
    sum += i;
}
console.log('for循环1+2 +…… + 100的结果是', sum)

循环关键字

• break； 跳出循环
• continue; 停止当前循环，进入下一次循环
• retuurn; 终止循环

for, forEach, for in, for of的区别