javascript第三天

Js的流程控制语句

  1. 顺序结构流程控制语句

(1)     Js代码从上到下执行

  1. 选择结构流程控制语句

(1)     If

①    if

1)       语法结构:if(判断条件){ 满足条件时执行的代码 }

2)       简写形式:if(判断条件)条件成立执行的代码  如果不写大括号 只能控制其后的第一句代码

②    If-else

1)       语法结构:if(判断条件){条件满足时执行的代码} else{条件不满足执行的代码}

2)       设置状态:如果遇到两种对立状态之间的切换效果,我们需要声明一个变量用来记录当前状态 之后根据状态进行判断 执行对应的操作,在操作的最后需要更新状态

③    If-else的分支语句

1)       If(判断条件){条件成立执行的语句} else if(判断条件1){判断条件不成立但判断条件1成立执行的语句}else if(条件2){前面条件都不成立但条件2成立执行的语句}......else{如果前面的条件都不成立 就执行else的代码}

2)       优势:可以处理任意情况

④    If-else的嵌套结构

1)       作用:如果需要同时满足多个判断条件就可以使用嵌套结构

2)       注意:这种嵌套结构性能不好,我们一般不用

  1. 我们一般使用逻辑与运算替代

(2)     Switch

①    如果遇到分支情况很多的时候 推荐使用switch

②    语法结构:switch(匹配常量){

case 匹配项1 :匹配成功执行的代码; break; 

case 匹配项2 :匹配成功执行的代码; break;

........

default : 如果所有匹配项都匹配失败 执行的代码;

 }

③    注意:switch执行的是匹配 执行的不是判断

  1. 获取元素的其他方法

(1)     Document.getElementsByTagName(‘标签名’)  通过标签名 获取元素

(2)     Document.getElementsByClassName (“类名”) 通过类名 获取元素

①    以上两个方法获取到的结果都是html元素集合(伪数组),因此不能直接操作,如果想操作元素集合中的标签,需要将标签一一取出,进行操作

(3)     byId、byTagName、byClassName三者的区别

①    byId获取到的结果是标签 而后两者获取的是元素集合

②    byId的范围只能是document、 后两者的范围则可以是任意父元素

  1. 循环结构流程控制语句

(1)     For

①    语法结构:for(初始化循环变量 ; 循环条件 ; 更新循环变量){ 循环体代码 }

②    三个表达式

1)       初始化循环变量:var 变量名 =  n

2)       循环条件 : 判断条件  如果满足就可以循环  如果不满足 就结束循环

3)       更新循环变量: 每次循环完一次之后 需要更新一次循环变量

③    浏览器控制台的断点调试

1)      

2)       进入sources选项之后要先在需要监测的位置打入断点

3)       并进一步选择要监测的数据

4)       添加完成之后 直接刷新页面 就可以开始断点调试了

5)       想结束断点调试 只需要将打入的断点取消掉,并刷新页面即可

④    For循环的嵌套(双重for循环)

1)       外层for循环 包裹 内层for循环

2)       一般用在多层次元素的嵌套中

3)       双重for循环执行的规则:外层循环执行一次  内层循环执行一轮

(2)     For-in循环

①    专门循环对象

1)       语法结构:for(var 属性名变量 in 要循环的对象){ 循环体代码 }

2)       For-in是一种智能循环,不需要用户自己手动循环 for-in是自动循环,对象有几个属性 就循环几次

(3)     While

①    语法结构:初始化循环变量  while(循环条件){ 循环体;更新循环变量 }

(4)     Do-while

①    语法结构:初始化循环变量  do{循环体代码; 更新循环变量}while(循环条件)

②    特点:不管是否满足循环条件 都会至少执行一次do语句

  1. 其他流程控制语句

(1)     break:彻底结束当前语句的执行

①    语法结构:break;

(2)     continue 只跳过当前这一次代码的执行 后续代码可以继续执行

①    语法结构:continue;

posted @ 2020-10-09 18:41  默默的1  阅读(122)  评论(0)    收藏  举报