JS基本语法

zwsun
236 阅读5分钟

JS是一门使用广泛、门槛极低、可以产生价值的语言，JS之父对JS的评价是：它的优秀之处并非原创，它的原创之处并不优秀。JS语言本身是有很多问题的，我们在学习JS时，需要取其精华，去其糟粕。今天在此总结有关JS的基本语法。主要参考：网道-JavaScript 的基本语法

表达式和语句

语句是为了完成某种任务而进行的操作，一般不需要返回值。JS程序的执行是以行为单位，一般来说一行就是一个语句。语句以;隔开，多个语句可以写在一行。

var a = 1 + 3 ;

这句话先用var命令声明变量a，然后将1+3的运算结果赋值给a。

1+3叫做表达式，指为了得到返回值的计算式，表达式为了得到返回值一般都会返回一个值。表达式不需要分号结尾。

注意：

  • console.log表达式的值为函数本身
  • console.log(3)表达式的值为undefined
  • add(1,2)表达式的值为函数的返回值

标识符

标识符指的是用来识别各种值的合法名称，最常见的标识符是变量名以及函数名。JS语言的标识符对字母大小写敏感，即a和A不是同一个标识符。

标识符的命名规则：

  • 第一个字符，可以是任意Unicode字母（包括英文字母和其他语言的字母），美元符号$，下划线_，中文。
  • 第二个字符及后面的字符，除了上面4种（Unicode字母、美元符号、下划线、中文），还可以用数字0~9。
  • 标识符中不可以包含星号*、加号+、减号（或连词线）—

注意：

JavaScript 有一些保留字，不能用作标识符：arguments、break、case、catch、class、const、continue、debugger、default、delete、do、else、enum、eval、export、extends、false、finally、for、function、if、implements、import、in、instanceof、interface、let、new、null、package、private、protected、public、return、static、super、switch、this、throw、true、try、typeof、var、void、while、with、yield。

条件语句

1.if else

if (m === 3) {
  // 满足条件时，执行的语句
} else {
  // 不满足条件时，执行的语句
}

{}在语句只有一句时可省略，但不推荐。

注意：

if后面的表达式之中，不要混淆赋值表达式（=）、严格相等运算符（===）和相等运算符（==）。尤其是赋值表达式不具有比较作用。

推荐使用：

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

2.switch

switch (fruit) {
  case "banana":
    // ...
    break;
  case "apple":
    // ...
    break;
  default:
    // ...
}

需要注意的是，switch语句后面的表达式，与case语句后面的表示式比较运行结果时，采用的是严格相等运算符（===），而不是相等运算符（==），这意味着比较时不会发生类型转换。例子如下：

var x = 1;

switch (x) {
  case true:
    console.log('x 发生类型转换');
    break;
  default:
    console.log('x 没有发生类型转换');
}
// x 没有发生类型转换

另外注意：break不要丢。

3.问号冒号表达式（三元运算符）

(条件) ? 表达式1 : 表达式2

三元运算符可被视为if...else...的简写形式，用法示例

var msg = '数字' + n + '是' + (n % 2 === 0 ? '偶数' : '奇数');

4.&&||短路逻辑

A && B && C && D —— 取第一个假值或D，并不会返回true/false

A || B || C || D —— 取第一个真值或D，并不会返回true/false

用法

fn && fn();
let a = a || b;

循环语句

1.while

while (条件){
  语句;
  }//若一条语句可省略{}

2.for

for (初始化语句; 条件表达式; 递增语句) {
  语句;
}//若一条语句可省略{}

for语句的三个部分（initialize、test、increment），可以省略任何一个，也可以全部省略。

3.break和continue

break语句和continue语句都具有跳转作用，可以让代码不按既有的顺序执行。

  • break语句用于跳出代码块或循环。

  • continue语句用于立即终止本轮循环，返回循环结构的头部，开始下一轮循环。

  • 如果存在多重循环，不带参数的break语句和continue语句都只针对最内层循环。(有label时特殊)

for (var i = 0; i < 5; i++) {
  console.log(i);
  if (i === 3)
    break;
}
// 0
// 1
// 2
// 3

var i = 0;

while (i < 100){
  i++;
  if (i % 2 === 0) continue;
  console.log('i 当前为：' + i);
}

上面代码只有在i为奇数时，才会输出i的值。如果i为偶数，则直接进入下一轮循环。

4.label

JavaScript 语言允许语句的前面有标签（label），相当于定位符，用于跳转到程序的任意位置，标签的格式如下。

label:
  语句

标签可以是任意的标识符，但不能是保留字，语句部分可以是任意语句。

标签通常与break语句和continue语句配合使用，跳出特定的循环。

break语句与标签配合使用

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);
    }
  }
// i=0, j=0
// i=0, j=1
// i=0, j=2
// i=1, j=0

上面代码为一个双重循环区块，break命令后面加上了top标签（注意，top不用加引号），满足条件时，直接跳出双层循环。如果break语句后面不使用标签，则只能跳出内层循环，进入下一次的外层循环。

continue语句与标签配合使用

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

上面代码中，continue命令后面有一个标签名，满足条件时，会跳过当前循环，直接进入下一轮外层循环。如果continue语句后面不使用标签(或者top放在内层循环for前面)，则进入下一轮的内层循环。

avatar
文章
阅读
粉丝