第一章 基本语法

Posted 2020-09-26

（本文为阮一峰js标准教程的学习笔记，旨在总结该教程中涉及的知识点大纲及个人所做的一些拓展，方便作为“目录”或者“大纲”复习和查漏补缺，详细内容请参见阮一峰教程原文）

********第一章 基本语法********

一.语句 表达式
1.js执行单位为line；
2.空语句 ;;;
3.少写无意义语句  "abc";(js引擎认为是语句但是没有任何意义)
4.允许多个语句写一行; var a=1+3;var b="abc";
5.分号代表语句的结束
6.语句（statement）是为了完成某种任务而进行的操作
7.1+ 3叫做表达式（expression），指一个为了得到返回值的计算式。
8.语句和表达式的区别：前者主要为了进行某种操作，一般情况下不需要返回值；后者则是为了得到返回值，一定会返回一个值。
9.凡是javascript语言中预期为值的地方，都可以使用表达式。

二.变量
1.变量概念：对"值"引用，建立变量与值的引用关系，包括传值引用和传址引用。
       内存层面理解：变量空间（没声明一个变量相当于开辟一个内存空间）
       最通俗的理解：用来存储一些可以变化的数据。
2.js语法中全局变量最大缺点是对任何一个代码块都是可读可写的，这对实现特定功能代码的模块化和重复使用非常不利（语言在最初设计时没有考虑太多，会有很多不合理的地方）。
3.只声明未赋值 值是undefined js一个关键字，是个特殊值，表示未定义。
4.忘记声明只赋值问题：  不自觉创建全局变量；js严格模式下会报错；
5.delete命令不能删 var a=1 可删a=1 delete可删window对象的a属性，但是不能删var命令声明的全局变量
6.未声明使用报错 xxx is not defined
7.一条var 声明多个变量 var a,b;
8.js动态类型，弱类型语言。变量类型无限制，变量类型会随赋的值变化。
9.如果使用var重新声明一个已经存在的变量，是无效的。

var x = 1;
var x;
x // 1

上面代码中，变量x声明了两次，第二次声明是无效的。

但是，如果第二次声明的同时还赋值了，则会覆盖掉前面的值。

var x = 1;
var x = 2;

// 等同于

var x = 1;
var x;
x = 2;

两次用var命令声明相同的变量，第二次声明并不会新开辟内存空间？【存疑，目前相信阮老师】
10.严格地说，var a = 1 与 a = 1，这两条语句的效果不完全一样，主要体现在delete命令无法删除前者。不过，绝大多数情况下，这种差异是可以忽略的。


11.变量提升：所有的变量的声明语句，都会（在js引擎预读时）被提升到代码的头部，这就叫做变量提升（hoisting）。
12.JavaScript引擎的工作方式是，先解析代码，获取所有被声明的变量，然后再一行一行地运行。
console.log(a);
var a = 1;
因为存在变量提升，真正运行的是下面的代码。

var a;
console.log(a);
a = 1;

最后的结果是显示undefined，表示变量a已声明，但还未赋值。
13.【js代码究竟会不会预编译查错，是预读还是预编译，未知】

14.变量提升只对var命令声明的变量有效，如果一个变量不是用var命令声明的，就不会发生变量提升。
console.log(b);
b = 1;
报错，b不是用var命令声明的，JavaScript引擎不会将其提升，而只是视为对顶层对象的b属性的赋值。

三.标识符
1.概念：用来识别具体事物的一个名称（比如：变量名、函数名）。
2.js语言对标识符大小写敏感：a和A
3.有一套标识符命名规则，js引擎遇非法标识符报错。
    *不能有+ - * / 连词线 首位不能是数字；
    *中文可作合法标识符，可为变量名，少用
    *保留字不作标识符；
    *保留字，关键字，Infinity/NaN/undefined不能作为标识符；
4.注释：js引擎忽略的部分；
    *单行注//
    *多行注/**/
5.历史上JavaScript兼容html代码的注释，所以<!--和-->也被视为单行注释。

x = 1; <!-- x = 2;
--> x = 3;

上面代码中，只有x = 1会执行，其他的部分都被注释掉了。

四、区块
1.JavaScript使用大括号，将多个相关的语句组合在一起，称为“区块”（block）。
与大多数编程语言不一样，JavaScript的区块不构成单独的作用域（scope）。也就是说，区块中的变量与区块外的变量，属于同一个作用域。

需要注意的是，-->只有在行首，才会被当成单行注释，否则就是一个运算符。
2.{
  var a = 1;
}

a // 1

单独使用的区块在JavaScript中意义不大，很少出现。区块往往用来构成其他更复杂的语法结构
，比如for、if、while、function等。

《控制语句：通过规定的语法结构来控制代码/语句的在js引擎中的执行，这种执行流程的控制是代码程序具有逻辑性的体现之一》
五、条件语句
1.if结构
if (expression布尔表达式：要求返回值是布尔值，由于js弱类型，这里即使不是布尔js引擎在执行代码时会自动转换)
  statement;

// 或者

if (expression) statement;

*写符合语法的代码，也就是遵循一门语言规定的语法结构写代码是保证程序能按照特定逻辑执行的基础。
*（条件）后是一条语句可省略{}，多条语句加{}；
*相等运算符与赋值运算符的常见错误
解决方法：常量写左边；
if(2=x){}
*优先采用“严格相等”，而不是相等，从而避免类型自动转换的干扰；

2.if..else结构
if (m === 3) {
  // then
} else {
  // else
}

*else代码块总是跟随离自己最近的那个if语句。

var m = 1;
var n = 2;

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

相当于下面这样。

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

*多个if...else语句连写
if (m === 0) {
  // ...
} else if (m === 1) {
  // ...
} else {
  // ...
}

等价于
if(m === 0){
//...
}else{
  if (m === 1) {
  // ...
} else{
  // ...
}
}

*条件判断后执行的代码如果是一条语句不需要加{}
if (n === 2) console.log(‘hello‘);
else console.log(‘world‘);

3.switch结构
switch (fruit) {
  case "banana":
    // ...任意代码
    break;
  case "apple":
    // ...
    break;
  default:
    // ...
}

*替换多个if..else连写
*break不能少，否则一直执行到底不能跳出
*所有case都不符合，执行default内代码
*switch()括号内，和case后面可以是变量，表达式，或者某个类型的值，但不能是语句！
*switch()内核case后面的表达式的值比较采用“===”

4.三元？：
即该运算符需要三个运算子）?:，也可以用于逻辑判断，简化版的if条件判断结构，可替代if..else..语句
(condition) ? expr1 : expr2
（）内值为true返回expr1,false返回expr2

六.循环控制语句：该结构可以实现某段代码/语句/操作的重复执行。
1.while循环
while (expression)
  statement;

// 或者

while (expression) statement;

*一条语句可以无{}，多条语句{}
*while(true){}无限死循环。
2.for循环。
for (initialize; test; increment)
  statement

// 或者

for (initialize; test; increment) {
  statement
}


    初始化表达式（initialize）：确定循环的初始值，只在循环开始时执行一次。
    测试表达式（test）：检查循环条件，只要为真就进行后续操作。
    递增表达式（increment）：完成后续操作，然后返回上一步，再一次检查循环条件。


*一条语句可以无{}，多条语句{}【未测试】
*for与while转化问题
*for语句（）中可省略任何一个，也可全省，作死玩法想用您随意
for(;;;){
  console.log("Hello World")；
}

3.do..while循环
do
  statement
while (expression);

// 或者

do {
  statement
} while (expression);

*while()后面的;不能省略
*一条语句无{}，多条语句必须{}【未验证】

4.break语句和continue语句

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

4.1 break跳出代码块或者循环；
4.2continue终止本轮循环，返回循环头部开始下一轮；
4.3实例：var i = 0;

while(i < 100) {
  console.log(‘i当前为：‘ + i);
  i++;
  if (i === 10) break;
}

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

4.4不带参数的break语句和continue语句都只针对最内层循环。（跳出最内层循环/进入下一轮最内层循环）
var i = 0;

while (i < 100){
  i++;
  if (i%2 === 0) continue;
  console.log(‘i当前为：‘ + i);
}
5.标签
JavaScript语言允许，语句的前面有标签（label），相当于定位符，用于跳转到程序的任意位置，标签的格式如下。

label:
  statement

标签可以是任意的标识符，但是不能是保留字，语句部分可以是任意语句。
标签通常与break语句和continue语句配合使用，跳出特定的循环。

5.1与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不用加引号），满足条件时，直接跳出双层循环。
5.2与continue搭配
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命令后面有一个标签名，满足条件时，会跳过当前循环，直接进入下一轮外层循环。
5.3 break或continue命令后的标签不加双引号
5.4break、continue语句结束加分号