一些简单的JS语法

309 阅读5分钟

这篇文章简要总结一些JS基本语法,包括语句和表达式、标识符的规则、if else语句、循环语句、break continue语句、label标签。

1.语句和表达式

语句:为了完成某种任务而执行的操作,例如一个赋值语句,var a = 1 + 3,就声明了一个变量a,并将1+3的值赋给了a。

表达式:指为了得到一个返回值的计算式,例如上述的1+3就是一个表达式。

语句和表达式的区别在于,语句主要为了进行某种操作,一般情况下不需要返回值;后者则是为了得到返回值,一定会返回一个值。凡是 JavaScript 语言中预期为值的地方,都可以使用表达式。比如,赋值语句的等号右边,预期是一个值,因此可以放置各种表达式。

语句以分号结尾,一行内可以放多条语句,而表达式不能使用分号结尾,一旦使用了分号,JavaScript就会将其作为语句,而通常这样的语句是没有什么实际意义的,例如“1+3;”仅仅只是单纯地产生了一个数值4而已。

2.标识符的规则

标识符指的是用来识别各种值的合法名称,包括变量名、函数名等。在自定义名称的时候要遵循标识符的命名规则,否则浏览器就会报错。命名规则如下:

  • 第一个字符,可以是任意 Unicode 字母(包括英文字母和其他语言的字母),以及美元符号($)和下划线(_),注意也可以采用中文字符。
  • 第二个字符及后面的字符,除了 Unicode 字母、美元符号和下划线,还可以用数字0~9.
  • JavaScript的保留字不能作为自定义的标识符,例如arguments、break、case、catch、class、const、continue等等。

3.if else语句

语句形式是:

if(布尔值){ 语句块一 }else{ 语句块二 }

意思是当布尔值为真时执行语句块一,布尔值为假时执行语句块二,当语句块内只有一条语句时,可以不加大括号,但是不建议这样做。下面展示一些特别的使用场景:

场景1:

        var a = 1;
        if (a = 2) {
            console.log("a等于2");
        } else {
            console.log("a不等于2");
        }

上述代码的执行结果是打印出“a等于2”,原因是在if后面的圆括号中写的语句是“a = 2”,=是一种赋值符号,而不是判断符号,将2赋给变量a再判断,结果就为true,因此会执行打印出“a等于2”。

场景2:

        var m = 1;
        var n = 2;
        if (m !== 1)
            if (n === 2) console.log('hello');
            else console.log('world');

上述代码的执行结果是不会打印出任何内容,当没有大括号时,if会执行后面的第一条语句,同时else代码块跟着的是最近的那个if语句。上述代码相当于:

       var m = 1;
       var n = 2;
       if (m !== 1) {
           if (n === 2) {
               console.log('hello');
           } else {
               console.log('world');
           }
       }

场景3:

        if (m === 0) {
          // ...
        } else if (m === 1) {
          // ...
        } else if (m === 2) {
          // ...
        } else {
          // ...
        }

注意else语句后还可以跟判断语句,进而对同一个变量进行多次判断。

4.循环语句

循环语句主要有while循环和for循环。

while循环:

While语句包括一个循环条件和一段代码块,只要条件为真,就不断循环执行代码块。语法如下:

        while (条件) {
            语句块;
        }

while语句的循环条件是一个表达式,必须放在圆括号中,语句块部分中如果只有一条语句,可以省略大括号,否则就必须加上大括号。

for循环:

for循环可以指定循环的起点、终点和终止条件。语法形式如下:

        for (初始化表达式; 条件表达式; 递增表达式) {
            语句块;
        }
  • 初始化表达式:确定循环变量的初始值,只在循环开始时执行一次。
  • 条件表达式:每轮循环开始时,都要执行这个条件表达式,只有值为真,才继续进行循环。
  • 递增表达式:每轮循环的最后一个操作,通常用来递增循环变量。

for循环中的执行顺序是:首先执行初始化表达式,然后判断是否符合条件表达式,如果符合则执行语句块,执行完后再执行递增表达式,递增后再次判断条件表达式,一旦不再符合则退出循环。在这个过程中要注意:1.初始化表达式只执行一次。2.每进入语句块执行之前都要先进行条件表达式判断。3.执行完一次循环的最后再次执行递增表达式,也就是说最后的值一定会等于一个不满足条件表达式的值。如下,最后输出i的值为5:

        for (var i = 0; i < 5; i++) {
            console.log("i的值是:" + i);
        }
        console.log("i的值是:" + i);

另外,需要注意的是for语句的三个部分(初始化表达式; 条件表达式; 递增表达式),可以省略任何一个,也可以全部省略。以下这种情况会导致无限循环:

        for ( ; ; ){
          console.log('Hello World');
        }

5.break和continue语句

break语句和continue语句都具有跳转作用,可以让代码不按既有的顺序执行。break语句用于跳出离它最近的循环,continue语句用于终止本轮循环,返回循环结构的头部,开始下一轮循环。

6.lebal标签

在语句前面标明标签就相当于定位符,可以用于跳转到程序的任意位置,lebal的语法如下:

        label:{
            语句块
        }

标签可以是任意的标识符,通常与break、continue配合使用,用于跳出特定的循环。例如:

top:
  for (var i = 0; i < 3; i++){
    for (var j = 0; j < 3; j++){
      if (i === 1 && j === 1){
          break top;
      }
      console.log('i=' + i + ', j=' + j);
    }
  }

这是一个双重循环,break命令后面加上了top标签,那么当满足if条件时,就直接跳出双层循环,而如果break语句后面不使用标签,则只能跳出内层循环,进入下一次的外层循环。