JS的基本语法

102 阅读4分钟

什么是表达式和语句?

  • JavaScript中的表达式和语句是有区别的。

  • 一个表达式会产生一个值,它可以放在任何需要一个值的地方,比如,作为一个函数调用的参数。举些栗子:

    myvar
    3 + x
    myfunc("a", "b")
    
  • 笼统来说,一个语句表示执行了一个动作。循环控制语句和if语句就是例子。一个程序基本上就是一系列的语句的集合。语句是为了完成某种任务而进行的操作,比如赋值语句:

    var a = 1 + 5;
    

    在这条语句中,上面的1 + 5就是表达式。

  • 语句和表达式的区别在于,语句是为了进行某种操作,一般情况下不需要返回值,而表达式都是为了得到返回值,一定会返回一个值(这里的值不包括undefined)

标识符

在JS中所有的可以由我们自主命名的都可以称为是标识符。例如:变量名、函数名、属性名都属于标识符。

  • 规则:
  1. 第一个字符可以是Unicode字符或者美元符号$或者下划线_或者中文
  2. 后面的字符,除了上面所说,还可以有数字
  3. 标识符不能是ES中的关键字或保留字, 查看关键字/保留字可见此链接
  • 举些例子

    /* 这些变量名都是标识符 */
    var _ = 1;
    var $ = 2;
    var $9 = 99;
    var ______ = 6;
    var 你好 = "hihi";
    

if else 语句

当指定条件为真,if 语句会执行一段语句。如果条件为假,则执行另一段语句。

  • 语法

    if (condition1)
       statement1
    else if (condition2)
       statement2
    else if (condition3)
       statement3
    ...
    else
       statementN
    
  • 最推荐写法

    if (condition1) {
        statement1
    } else if (condition2) {
        statement2
    } else {
        statement3
    }
    
  • 次推荐写法

    function fn() {
        if (condition1) {
            return statement1;
        }
        if (condition2) {
            return statement2;
        }
        return statement3;
    }
    
  • && 短路运算

    • A && B

      1. 只要 && 前面是 false,无论 && 后面是true还是 false,结果都将返 && 前面的值;
        1. 只要 && 前面是 true,无论 && 后面是true还是 false,结果都将返 && 后面的值;
    • A && B && C && D: 永远取第一个假值或者D

    • 应用

      /* 第一个栗子 */
      //如果this.data判定为true则就会执行后续操作; 
      //如果this.data为false就不会执行以后的操作
      this.data && this.getPhone(); 
      
      
      //等价于
      if(this.data) {
          this.getPhone()
      } else {
      
      }
      
      /* 第二个栗子 */
      if(a >=5){
          alert("你好"); 
      }
      
      //可以简化为
      a >= 5 && alert("你好");
      
  • || 短路运算

    • A || B
      1. 只要 || 前面为 false,无论 || 后面是true还是 false,结果都返回 || 后面的值。
      2. 只要 || 前面为 true,无论 || 后面是true还是 false,结果都返回 || 前面的值。
    • A || B || C || D:永远取第一个真值或者D
    • 应用
      /* 第一个栗子 */
      a = a || 100
      
      //等价为
      if (a) {
          a = a;
      } else {
          a = 100;
      }
      
      /* 第二个栗子 */
      //显然给attr赋值的时候第一个值判为false,所以取的是this.attr。
      //如果this.attr也判为false则取的是空字符串。
      let attr = null || this.attr || "";
      
  • 三目远算

    if (a > 0) {
            alert("true");
    } else {
            alert("false");
    }
    
    //等价于
    (a > 0) ? alert("true") : alert("false");
    

while for 语句

  • while循环的语法:

    1. 判断表达式的真假
    2. 当表达式为真,执行循环体语句,执行完再判断表达式真假
    3. 当表达式为假,执行循环后面的语句
    while (表达式) { 
        // 代码 
        // 所谓的“循环体” 
    }
    
  • for循环的语法:

    for (begin; condition; step) { 
        // ……循环体…… 
    }
    
    /* 举个栗子 */
    for (let i = 0; i < 3; i++) { // 结果为 0、1、2 
        alert(i); 
    }
    
    语句段
    begini=0进入循环时执行一次。
    conditioni < 3在每次循环迭代之前检查,如果为 false,停止循环。
    body (循环体)alert(i)条件为真时,重复运行。
    stepi++在每次循环体迭代后执行。

break VS. continue 跳出循环

  • 通常条件为假时,循环会终止。但我们随时都可以使用 break 指令强制退出。break退出整个循环。
    /* 例如,下面这个循环要求用户输入一系列数字,在输入的内容不是数字时“终止”循环。*/
    let sum = 0;
    
    while (true) {
      let value = +prompt("Enter a number", '');
    
      if (!value) break;
    
      sum += value;
    }
    alert( 'Sum: ' + sum );
    
  • continue 指令是 break 的“轻量版”。它不会停掉整个循环。而是停止当前这一次迭代,并强制启动新一轮循环(如果条件允许的话)。
    for (let i = 0; i < 10; i++) {
    
      //如果为真,跳过循环体的剩余部分。
      if (i % 2 == 0) continue;
    
      alert(i); // 1,然后 3,5,7,9
    }
    

label

  • 语法:
    label :
       statement
    
  • 可使用一个标签来唯一标记一个循环,然后使用 break 或 continue 语句来指示程序是否中断循环或继续执行。

推荐阅读