[JavaScript知识库]JS第一天

JavaScript 的基本语法

语句

JS程序的执行单位为行，每一行就是一个语句（操作）。

普通赋值语句：

var a = 'hello';

表达式：

var a = 1 + 3;

空语句：

;;;

变量

JS中的变量一般使用var命令声明，声明之后就是局部变量，如果不使用var命令声明变量，就是全局变量。

var a = 1;	//局部变量
// 基本等同
a = 1;	//全局变量

JS的变量名区分大小写，A和a是两个不同的变量。

var a = 1;
var A = 2;

JS若只声明变量而不赋值，该变量的值就为undefined（特殊值，表示无定义）。

var a;
a // undefined

JS不能直接使用变量，若直接使用会报错

x
// ReferenceError: x is not defined

JS支持同时声明多个变量，且由于是动态类型语言，因此可随时更改变量类型

var a, b;

var a = 1;
a // 1
a = 'hello';
a // 'hello'

JS不能重复声明同一个变量，若声明两次，第二次无效；若第二次声明带有赋值，则会覆盖前面的值

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

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

变量提升

JS存在变量提升，就是即使声明的语句不在首位也会自动提升至首位，不会报错

console.log(a);
var a = 1;
// undefined
// 最后的结果是显示`undefined`，表示变量`a`已声明，但还未赋值。


// 等同于

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

标识符

JS中识别各种值的合法名称（变量名、函数名等）就是标识符（区分大小写）

• 第一个字符，可以是任意 Unicode 字母（包括英文字母和其他语言的字母），以及美元符号（$）和下划线（_）。
• 第二个字符及后面的字符，除了 Unicode 字母、美元符号和下划线，还可以用数字0-9。
• 变量名可以使用中文
• 存在保留字不能作为标识符

合法标识符示例：

arg0_tmp$elemπ
var 临时变量 = 1;

不合法标识符示例：

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

JS保留字：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。

注释

JS存在两种注释写法：

• 单行注释，用//起头
• 多行注释，放在/*和*/之间。
• 兼容HTML，<!--和-->

// 这是单行注释

/* 
	这是
	多行
	注释
*/

<!--这是单行注释-->
x = 1; <!-- x = 2;
--> x = 3;
// 特殊写法
// 此种写法只有x = 1会执行，其它全被注释（注：-->在行首会被当成单行注释）

function countdown(n) {  while (n --> 0) console.log(n);}countdown(3)
// 2
// 1
// 0
// 此处的n --> 0会被当作n-- > 0，最后输出2、1、0

区块

JS存在大括号，可以将多个相关的语句组合在一起，称为区块，区块往往用来构成其他更复杂的语法结构，比如for、if、while、function等。
对于var命令来说，JS的区块不构成单独的作用域。

{  var a = 1;}
a // 1
// 使用var命令在区块内部声明并赋值变量`a`，变量a依然会在区块外部有效

条件语句

JS提供if结构和switch结构，完成条件判断，即只有满足预设的条件，才会执行相应的语句。

if 结构

if结构会先判断一个表达式的布尔值，根据布尔值的真伪，执行不同的语句。所谓布尔值，即true表示“真”，false表示“伪”。

if (布尔值)  
	语句;

// 或者

if (布尔值) 语句;

示例：

if (m === 3)  m = m + 1;
// 当m等于3时，m会将其值加上1

if (m === 3) {
	m += 1;
 }
// 加上大括号表示代码块（多个语句合并成一个语句）

// 注：if后面的表达式中，需要区分赋值表达式（=）、严格相等运算符（===）和相等运算符（==），同时赋值表达式不具有比较作用

if (x = 2) { // 不报错
if (2 = x) { // 报错

if…else 结构

if代码块后面，可以跟一个else代码块，表示不满足条件时，所要执行的代码。

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

else代码块只会与离自己最近的那个if语句配对

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

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');
	}
}
// 以上else代码块均不会执行，因为它们均配对了最近的那个if语句

通过改变大括号的位置，可以让else代码块跟随最上面的那个if语句

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

switch 结构

switch结构类似于多个if...else连在一起使用，而且相对方便
每个case代码块内部通过break语句跳出switch结构，否则会接下去执行下一个case代码块

switch (fruit) {
	case "banana":
		// ...    
		break;
	case "apple":
		// ...    
		break;
	default:
		// ...
}
// 根据变量fruit的值，选择执行对应的case。如果所有case都不符合，则执行最后的default部分

三元运算符 ?:

JavaScript 还有一个三元运算符：?:，可以用于逻辑判断。

(条件) ? 表达式1 : 表达式2
// 如果“条件”为true，返回“表达式1”的值，否则返回“表达式2”的值

示例：

var even = (n % 2 === 0) ? true : false;

// 等同于

var even;if (n % 2 === 0) {  even = true;} else {  even = false;}

利用三元运算符，在字符串之中插入不同的值

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

循环语句

循环语句用于重复执行某个操作，存在多种形式

while 循环

While语句包括一个循环条件和一段代码块，只要条件为真，会不断循环执行代码块

while (条件)  语句;

// 或者

while (条件) 语句;

while语句的循环条件是一个表达式，必须放在圆括号中
代码块部分，只有一条语句时可省略大括号，否则必须加上大括号

while (条件) {  语句;}

示例：

var i = 0;
while (i < 100) {
	console.log('i 当前为：' + i);
	i = i + 1;
}
// 循环100次，直到i等于100退出循环

无限循环（循环条件永远为真）

while (true) {
	console.log('Hello, world');
}

for 循环

for语句可以指定循环的起点、终点和终止条件

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

// 或者

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

for语句的括号里面，存在三个表达式：

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

示例：

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

无限循环

for ( ; ; ){
	console.log('Hello World');
}
// 由于省略了for语句表达式中的三部分，导致无限循环产生

do…while 循环

do...while循环与while循环类似，唯一的区别就是先运行一次循环体，然后判断循环条件
注：while语句后面的分号注意不能省略

do  
	语句
while (条件);

// 或者

do {  
	语句
} while (条件);
// 无论条件是否为真，do...while至少循环运行一次

示例：

var x = 3;
var i = 0;
do {
	console.log(i);  
	i++;
} while(i < x);

break 语句和 continue 语句

break语句和continue语句都具有跳转作用，可以强制退出循环

• break语句用于跳出代码块或循环。
• continue语句用于立即终止本轮循环，返回循环结构的头部，开始下一轮循环。
  注：如果存在多重循环，不带参数的break语句和continue语句都只针对最内层循环

var i = 0;
while(i < 100) {
	console.log('i 当前为：' + i);  
	i++;  
	if (i === 10) 
	break;
}
// 0
// 1
// 2
// 3
// 4
// 5
// 6
// 7
// 8
// 9
// 10
// 当i等于10，break触发强制退出循环

for (var i = 0; i < 5; i++) {
	console.log(i);  
	if (i === 3)    
		break;
}
// 0
// 1
// 2
// 3
// 当i等于3，break触发强制退出循环

var i = 0;
while (i < 100){
	i++;  
	if (i % 2 === 0) continue;  
	console.log('i 当前为：' + i);
}
// 当i为奇数时，才会输出`i`的值，如果i为偶数，则会退出此次循环再进入下一轮循环