[JamTin]开门见山——JS基础知识点(三)

开门见山——JS基础知识点(三)

JS代码块

我们的程序都是一条一条语句构成的，语句是按照自上向下的顺序一条一条执行的，在JS中可以使用{ }来为语句进行分组。

{
    alert("hello");
    console.log("你好");
    document.write("语句");
}

同一个{ }中的语句我们称为是一组语句，它们要么都执行，要么都不执行，一个{ }中的语句我们也成为一个代码块。JS中的代码块只具有分组的作用，代码块内容外部可见。

---

流程控制语句

由于JS的程序是从上往下一行行执行，通过流程控制语句可以控制执行的流程，使程序可以根据一定的条件来选择执行。语句分类有几种：1.条件判断语句 2.条件分支语句 3.循环语句

• 条件判断语句：

  使用条件判断语句可以在执行某个语句前进行判断，如果条件成立才会执行语句，不成立则不执行。

  if语句

  语法一：

  if(条件表达式)

  if语句在执行时，会先对条件表达式进行值判断，如果条件表达式的值为true，则执行if后的语句，如false，则不会执行if后的语句。

  var a = 11;
  if(a > 10)
      alert("a比10大");
  	alert("非控制语句");
  

  以上演示的两个alert都会被执行。换个例子：

  var a = 10;
  if(a > 10)
      alert("a比10大");
  	alert("非控制语句");
  

  这样第一条alert语句不会执行，但二条alert语句仍然执行。由此可见，if语句智能控制紧随其后的那个语句。

  如果希望if语句可以控制多条语句，这时就可以用到前面所提的代码块了。

  var a = 10;
  if(a > 10) {
      alert("a比10大");
  	alert("非控制语句");
  }
  

  两条alert语句均不执行。

  多条件控制可以灵活运用 && 还有 || 。

  语法二：

  if(条件表达式){

  ​ 语句…

  }else{

  ​ 语句…

  }

  表达式的值为true则执行if后的语句，false则执行else后的语句。

  语法三：

  if(条件表达式){

  ​ 语句…

  }else if(条件表达式){

  ​ 语句…

  }else if(条件表达式){

  ​ 语句…

  }else{

  ​ 语句…

  }

  当该语句执行时，会从上往下一次对条件表达式进行求值判断。如果值为true，则执行当前语句，为false则向下判断。

• 条件分支语句：

  也叫switch语句。

  语法：

  switch(条件表达式){
  ​ case 表达式：
  ​ 语句…
  ​ break；
  ​ case 表达式：
  ​ 语句…
  ​ break；
  ​ case 表达式：
  ​ 语句…
  ​ break；
  ​ default:
  ​ 语句…
  ​ break;
  }
  switch 语句和 if 语句的功能实际上有重复的，使用switch可以实现if的功能，同样使用if也可以实现switch的功能， 根据自己的习惯选择。

• 循环语句：

  while循环

  语法：

  while(条件表达式){

  ​ 语句…

  }

  while语句在执行时，先对条件表达式进行求值判断，如果值为true则执行循环体。循环体执行完以后继续对表达式进行判断，如果为true则继续执行循环体。

  do…while循环

  语法：

  do{

  ​ 语句…

  }while(条件表达式)

  do…while语句执行会先执行循环体，循环体执行完毕后对while后的表达式进行判断。

  for循环

  语法：

  for(①初始化表达式; ②条件表达式; ④更新表达式){

  ​ ③语句…

  }

  for循环的执行流程：

  ①执行初始化表达式，初始化变量

  ②执行条件表达式，判断是否执行循环

  ​ 如果为true，则执行循环③

  ​ 如果为false，终止循环

  ④执行更新表达式，更新表达式执行完毕重复②

• break和continue

  break关键字可以用来退出switch或循环语句。不能在if语句中使用break和continue。

  break会立即终止离他最近的循环语句。

  for (var i = 0; i < 5; i++) {
      console.log("@外层循环"+i);
      for (var j = 0; j < 5; j++) {
          break;
          console.log("内层循环"+j);
      }
  }
  /* 
  @外层循环0
  @外层循环1
  @外层循环2
  @外层循环3
  @外层循环4
  */
  

• 可以为循环语句创建一个label，来标识当前的循环

  • label：循环语句

  使用break语句时，可以在break后跟着一个label结束指定的循环。

  outer:
  for (var i = 0; i < 5; i++) {
      console.log("@外层循环"+i);
      for (var j = 0; j < 5; j++) {
          break outer;
          console.log("内层循环"+j);
      }
  }
  /* 
  @外层循环0
  */
  

• continue是对最近的一层循环产生效果，跳过本次循环体中余下尚未执行的语句，立即进行下一次的循环条件判定，可以理解为仅结束本次循环。continue语句并没有使整个循环终止。

  var x = 0;
  while(x++ < 10){
      if(x == 3){
          continue;
      }
      console.log(x);
  }
  /*
  结果是：1 2 4 5 6 7 8 9 10 
  仅不输出3
  */