JavaScript基础语法

JavaScript 教程:https://wangdoc.com/javascript/index.html
ES6 教程:https://wangdoc.com/es6/

JS 做客户端语言

按照相关的 JS 语法，去操作页面中的元素，有时要操作浏览器里的一些功能

• ECMAScript3/5/6.。。：JS的语法规范（变量、数据类型、操作语句等等）
• DOM（document object model）：文档对象模型，提供一些 JS 的属性和方法，用来操作页面中的 DOM 元素
• BOM（browser object model）：浏览器对象模型，提供一些 JS 的属性和方法，用来操作浏览器的相关功能

// 赋值语句
// 分号前面没有内容，被视为空语句
// 1+3 叫做表达式 expression，a = 1+3 叫做语句
var a = 1 + 3; var b = 'abc';;;;;

// 变量
// 变量名区分大小写
// 一句可以声明多个变量
var a = 1;
var A = 1;
var b;
b // undefined
var c,d,e,f;

// 变量提升
// JavaScript 引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。
// 这造成的结果，就是所有的变量的声明语句，都会被提升到代码的头部，这就叫做变量提升（hoisting）

// 标识符（identifier）
// 标识符命名规则如下:
// 1.第一个字符，可以是任意 Unicode 字母（包括英文字母和其他语言的字母），以及美元符号（$）和下划线（_）。
// 2.第二个字符及后面的字符，除了 Unicode 字母、美元符号和下划线，还可以用数字0-9。
// 3.中文是合法的标识符，可以用作变量名
// 4.一些保留字，不能用作标识符：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。
arg0
_tmp
$elem
π

1a  // 第一个字符不能是数字
23  // 同上
***  // 标识符不能包含星号
a+b  // 标识符不能包含加号
-d  // 标识符不能包含减号或连词线

// 注释
// 这是单行注释
/*
    这是
    多行
    注释
*/
// 因JavaScript兼容HTML代码的注释，所以 <!-- 和 --> 也为合法单行注释；-->需要在行首才为单行注释

// 区块
// 区块不构成单独的作用域
// 区块内部声明变量在区块外部仍然可以使用
// 区块往往用来构成其他更复杂的语法结构，比如for、if、while、function等
{
    var a = 1;
}

a // 1

// if、if...else...、if...elif...else
if (m === 0) {  // === 为严格相等、== 为相等、= 为赋值，if 判断不用 =
    // ...
  } else if (m === 1) {
    // ...
  } else if (m === 2) {
    // ...
  } else {
    // ...
  }

// switch 结构
switch (x) {
    case 1:
      console.log('x 等于1');
      break;
    case 2:
      console.log('x 等于2');
      break;
    default:
      console.log('x 等于其他值');
  }

// 三元运算符
// (条件) ? 表达式1 : 表达式2
// 如果条件为 true，则返回表达式1的 值，否则则返回表达式2的值
var even = (n % 2 === 0) ? true : false;  // 如果 (n % 2 === 0) n可以被2整除 则返回 true ，并赋值给 even

// while 循环
/*
while (条件) {
    语句;
  }
*/
var i = 0;

while (i < 100) {
  console.log('i 当前为：' + i);
  i = i + 1;
}

// for 循环
/*
for (初始化表达式; 条件; 递增表达式)
  语句

// 或者

for (初始化表达式; 条件; 递增表达式) {
  语句
}

初始化表达式（initialize）：确定循环变量的初始值，只在循环开始时执行一次。
条件表达式（test）：每轮循环开始时，都要执行这个条件表达式，只有值为真，才继续进行循环。
递增表达式（increment）：每轮循环的最后一个操作，通常用来递增循环变量。
*/

// do.. while 循环
/**
do
  语句
while (条件);

// 或者
do {
  语句
} while (条件);
 */

// break语句用于跳出代码块或循环
// continue语句用于立即终止本轮循环，返回循环结构的头部，开始下一轮循环

// 标签 label
// 语句的前面有标签（label），相当于定位符，用于跳转到程序的任意位置
/* 标签的格式为：
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;  // break 之后跳出双层循环，进入 top 执行新一轮的最外层循环
      console.log('i=' + i + ', j=' + j);
    }
  }
// i=0, j=0
// i=0, j=1
// i=0, j=2
// i=1, j=0
foo: {
    console.log(1);
    break foo;      // 用于跳出代码块
    console.log('本行不会输出');    
  }
  console.log(2);
  // 1
  // 2
  top:
  for (var i = 0; i < 3; i++){
    for (var j = 0; j < 3; j++){
      if (i === 1 && j === 1) continue top;     // continue 单独使用智能跳过当前循环进入下一轮内层循环，与 label 结合使用可以直接跳到最外循环
      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