05_JavaScript基本语法

1 变量

1.1 标识符

程序开发中，经常需要自定义一些符号来标记一些名称，并赋予其特定的用途，如变量名、函数名等，这些符号都被称为标识符。

定义规则

• 由大小写字母（A-Z,a-z）、数字（0-9）、下划线（_）和美元符号（$）组成。
• 不能以数字开头。
• 严格区分大小写。
• 不能使用 JavaScript 中的关键字命名。例如：var,for,while。
• 要尽量要做到“见其名知其意”。
• 标识符虽然以 unicode 编码表示，可以使用 utf-8 的所有内容，但是只推荐使用英文。

注意

• 当标识符中需要多个单词进行表示时，常见的表示方式有下划线法（匈牙利命名法）（如user_name）、驼峰法（小驼峰命名法）（如userName）和帕斯卡法（大驼峰命名法）（如UserName）。
• 下划线方式通常应用于变量的命名，驼峰法通常应用于函数名的命名等。

课堂练习：

判断以下标识符是否合法

it、It、t-o、t o、age66、_age、789lu、$name

1.2 保留关键字

• 保留关键字：是指在 JavaScript 语言中被事先定义好并赋予特殊含义的单词。

break	case	catch	class	const	continue
debugger	default	delete	do	else	export
extends	false	finally	for	function	if
import	in	instanceof	new	null	return
super	switch	this	throw	try	true
typeof	var	void	while	with	yield

注：关键字不能作为变量名和函数名使用，否则会使 JavaScript 在载入过程中出现语法错误。

• 未来保留关键字：是指预留的，未来可能会成为保留关键字的单词。

abstract	arguments	await	byte	boolean	char
double	enum	eval	final	float	goto
implements	int	interface	let	long	native
package	private	protected	public	short	static
synchronized	throws	transient	volatile

注：标识符在定义时，建议不要用未来保留关键字，避免将来转换为关键字时出现错误。

1.3 变量作用

变量可以看作是存储数据的容器。（盛水的杯子，杯子指变量，杯中的水指保存在变量中的数据。）

语法

• JavaScript中变量通常利用 var 关键字声明，并且变量名的命名规则与标识符相同。
• 合法变量名（如number、_it123）、非法变量名（如88shout、&num）。

var sales;
var hits, hot, NEWS;
var room_101, room102;
var $name, $age;

• 未赋初始值的变量，默认值会被设定为 undefined。
• 行末的分号表示语句结束。
• 变量与变量之间的逗号（,）操作符，可实现一条语句同时完成多个变量的声明。

1.4 变量赋值

// 声明变量、为变量赋值
var unit, room;
unit = 3;
room = 1001;

// 声明变量的同时为变量赋值
var fname = 'Tom', age = 12;

// 省略var关键字，直接为变量赋值
flag = false;
a = 1, b = 2;

JavaScript 中变量虽然可以不事先声明，直接省略 var 关键字为变量赋值。但由于 JavaScript 采用的是动态编译，程序运行时不容易发现代码中的错误，所以推荐在使用变量前，要养成先声明的良好习惯。

1.5 定义常量

可以理解为在脚本运行过程中值始终不变的量。数学中的圆周率 π 就是一个常量，其值就是固定且不能被改变的。

特点：一旦被定义就不能被修改或重新定义。

语法：ES6 中新增了 const 关键字，用于实现常量的定义

常量命名规则：遵循标识符命名规则，习惯上常量名称总是使用大写字母表示。

常量的值：常量在赋值时可以是具体的数据，也可以是表达式的值或变量。

var r = 6;
const PI = 3.14;
const P = 2 * PI * r;
// 输出结果：P=37.68
console.log('P=' + P);

• 常量一旦被赋值就不能被改变。
• 常量在声明时必须为其指定某个值。

2 数据类型

在使用或赋值时根据设置的具体内容再确其对应的类型。但每一种计算机语言都有自己所支持的数据类型，JavaScript也不例外。

2.1 数据类型分类

• 基本数据类型（值类型）

• Boolean（布尔型）
• Number（数值型）
• String（字符型）
• Null（空型）
• Undefined（未定义型）

• 引用数据类型：Object（对象）

引用数据类型，将会在后面的章节详细介绍。

注：在 JavaScript 中，任何不是数值、字符串、布尔值、符号、null和undefined的值都是对象。

2.2 基本数据类型

2.2.1 布尔型

布尔型是 JavaScript 中较常用的数据类型之一，通常用于逻辑判断。

• true
• false

表示事物的“真”和“假”，严格遵循大小写，因此 true 和 false 值只有全部为小写时才表示布尔型。

2.2.2 数值型

JavaScript中的数值型并不区分整数和浮点数，所有数字都是数值型。

• 添加“- ”符号表示负数。
• 添加“+ ”符号表示正数（通常情况下省略“+”）。
• 设置为 NaN 表示非数值。

// 八进制数字序列范围：0~7
// 十六进制数字序列范围：0~9以及A~F
// 在JS中八进制前面加 0，十六进制前面加 0x
var oct = 032;		  // 八进制数表示的26
var dec = 26;		  // 十进制数26
var hex = 0x1a;		  // 十六进制数表示的26
var fnum1 = 7.26;	  // 标准格式
var fnum2 = -6.24;	  // 标准格式
var fnum3 = 3.14E6;	  // 科学计数法格式3.14*106
var fnum4 = 8.96E-3;  // 科学计数法格式8.96*10-3

只要给定的值不超过 JavaScript 中允许数值指定的范围即可。

特殊值

• Infinity ，代表无穷大，大于任何数值
• -Infinity ，代表无穷小，小于任何数值
• NaN ，Not a Number，代表一个非数值

NaN 非数值

• NaN 是一个全局对象的属性，它的初始值就是 NaN。
• 与数值型中的特殊值 NaN 一样，都表示非数字（Not a Number）。
• 可用于表示某个数据是否属于数值型。
• NaN 没有一个确切的值，仅表示非数值型的一个范围。
• 例如，NaN 与 NaN 进行比较时，结果不一定为真（true），这是由于被操作的数据可能是布尔型、字符型、空型、未定义型和对象型中的任意一种类型。

2.2.3 字符型

字符型（String）是由Unicode字符、数字等组成的字符序列，这个字符序列我们一般将其称为字符串。

作用：表示文本的数据类型。

语法：程序中的字符型数据包含在单引号（'）或双引号（"）。

var slogan = 'Knowledge';		// 单引号，存放一个单词
var str = "the sky is blue."; 	// 双引号，存放一个句子
var color = '"red"blue'; 		// 单引号中包含双引号
var food = "'pizza'bread";		// 双引号中包含单引号
var num = '', total = "";		// 定义空字符串

• 由单引号定界的字符串中可以包含双引号。
• 由双引号定界的字符串中也可以包含单引号。

**如何在在单引号中使用单引号，或在双引号中使用双引号？**利用转义字符“\”进行转义。

var say1 = 'I\'m is ...';  	 // 在控制台的输出结果：I'm is ...
var say2 = "\"Tom\"";        // 在控制台的输出结果："Tom"

在字符串中使用换行、Tab等特殊符号时，也需要利用转义符“\”的转义。

特殊字符	含义	特殊字符	含义
\'	单引号	\"	双引号
\n	回车换行	\v	跳格（Tab、水平）
\t	Tab符号	\r	换行
\f	换页	\\	反斜杠（\）
\b	退格	\0	Null字节
\xhh	由两位16进制数字hh表示的ISO-8859-1字符。如“\x61”表示“a”	\uhhhh	由四位16进制数字hhhh表示的Unicode字符。如“\u597d”表示“好”

2.2.4 空型

• 空型（Null）只有一个特殊的 null 值。
• 空型用于表示一个不存在的或无效的对象与地址。
• JavaScript 中大小写敏感，因此变量值只有是小写的 null 时才表示空型（Null）。

2.2.5 未定义型

• 未定义型（Undefined）也只有一个特殊的 undefined 值。
• 未定义型用于声明的变量还未被初始化时，变量的默认值为 undefined。
• 与 null 不同的是，undefined 表示没有为变量设置值，而 null 则表示变量（对象或地址）不存在或无效。
• 注意：null 和 undefined 与空字符串（‘’）和 0 都不相等。

2.3 数据类型检测

为什么需要数据类型检测，先看下面的示例。

var num1 = 12, num2 = '34', sum = 0;	// 声明变量并赋值
sum = num1 + num2;			            // 变量进行相加运算
console.log(sum); 			            // 输出结果：1234

请分析并说出变量 sum 的数据类型，以及为什么？

• 变量sum是字符型。
• 运算符“+”的操作数只要有一个是字符型，则它表示字符拼接。
• 参与运算的两个变量，num1 是数值型，num2 是字符型，因此最后的输出结果变量 sum 就是 num1 与 num2 进行拼接后的字符串。

所以，对参与运算的数据类型有要求时，需要进行数据类型检测。

JavaScript中对于数据类型的检测提供了以下两种方式：

typeof 操作符

typeof 操作符以字符串形式，返回未经计算的操作数的类型。

onsole.log(typeof num1);       	// 输出结果：number
console.log(typeof num2);       // 输出结果：string
console.log(typeof sum);       	// 输出结果：string

在利用 typeof 检测 null 的类型时返回的是 object 而不是 null。

Object.prototype.toString.call()

由于 JavaScript 中一切皆对象，因此可利用 Object.prototype.toString.call() 对象原型的扩展函数更精确的区分数据类型。

var data = null;	// 待判断的数据
var type = 'Null';	// 数据类型，开始字母要大写，如Boolean等
// 检测数据类型的表达式，若是指定的type型，则返回true，否则返回false
Object.prototype.toString.call(data) == '[object ' + type + ']';

Object.prototype.toString.call(data) 的返回值是一个形如“[object 数据类型]”的字符型结果。（可通过console.log() 观察返回值。）

2.4 数据类型转换

2.4.1 转布尔型

经常用于表达式和流程控制语句中，如数据的比较、条件的判断。

语法：Boolean() 函数。

注意：Boolean() 函数会将任何非空字符串和非零的数值转换为 true，将空字符串（‘’）、0、NaN、undefined 和 null 转换为false。

// 判断用户是否有内容输入。
var con = prompt(); 
if (Boolean(con)) {
  document.write('已输入内容');
} else {
  document.write('无输入内容');
}

对 Boolean(con) 分析：

• 用户单击“取消”按钮，则结果为 false
• 用户未输入，单点击“确定”按钮，则结果为 false
• 用户输入“哈哈”，单点击“确定”按钮，则结果为 true

2.4.2 转数值型

实际开发中在接收用户传递的数据进行运算时，为了保证参与运算的都是数值型，经常需要对其进行转换。

语法：Number() 函数、parseInt() 函数或 parseFloat() 函数。

// 根据用户的输入完成自动求和。
// 获取用户的输入，完成自动求和
var num1 = prompt('请输入求和的第1个数据：');   // 123
var num2 = prompt('请输入求和的第2个数据：');   // 456abc
console.log(num1 + num2);  // 123456abc
console.log(parseInt(num1) + parseInt(num2));  // 579

转数值型的函数在使用时有一定的区别。

待转数据	Number()	parseInt()	parseFloat()
纯数字字符串	转成对应的数字	转成对应的数字	转成对应的数字
空字符串	0	NaN	NaN
数字开头的字符串	NaN	转成开头的数字	转成开头的数字
非数字开头字符串	NaN	NaN	NaN
null	0	NaN	NaN
undefined	NaN	NaN	NaN
false	0	NaN	NaN
true	1	NaN	NaN

• 所有函数在转换纯数字时会忽略前导零，如“0123”字符串会被转换为123。
• parseFloat() 函数会将数据转换为浮点数（可以理解为小数）。
• parseInt() 函数会直接省略小数部分，返回数据的整数部分，并可通过第2个参数设置转换的进制数。

注意：在实际开发中还需要对转换后的结果是否是 NaN 进行判断，只有不是 NaN 时，才能够进行运算。此时可使用 isNaN() 函数来确定，当给定值为 undefined、NaN 和 {}（对象）时返回 true，否则返回 false。

2.4.3 转字符型

语法：String() 函数和 toString() 方法。

区别： String() 函数可以将任意类型转换为字符型；除了 null 和 undefined 没有 toString() 方法外，其他数据类型都可以完成字符的转换。

// 根据用户的输入完成自动求和。
var num1 = num2 = num3 = 4, num4 = 26;
console.log(String(12));
console.log(num1 + num2 + num3.toString());
console.log(num4.toString(2));

注意：toString() 方法在进行数据类型转换时，可通过参数设置，将数值转换为指定进制的字符串，例如num4.toString(2)，表示首先将十进制26转为二进制11010，然后再转为字符型数据。

3 表达式

表达式可以是各种类型的数据、变量和运算符的集合。

最简单的表达式可以是一个变量。

var x, y, z;         // 声明变量
x = 1;		         // 将表达式“1”的值赋给变量x
y = 2 + 3;	         // 将表达式“2 + 3”的值赋给变量y
z = y = x;	         // 将表达式“y = x”的值赋给变量z
console.log(z);	     // 将表达式“z”的值作为参数传给console.log()方法
console.log(x + y);  // 将表达式“x + y”的值作为参数传给console.log()方法

4 运算符

所谓运算符就是专门用于告诉程序执行特定运算或逻辑操作的符号。

4.1 算术运算符

• 对数值类型的变量及常量进行算数运算。
• 也是最简单和最常用的运算符号。

运算符	运算	范例	结果
+	加	5+5	10
-	减	6-4	2
*	乘	3*4	12
/	除	3/2	1.5
%	求余	5%7	5
**	幂运算	3**4	81
++	自增（前置）	a=2, b=++a;	a=3;b=3;
++	自增（后置）	a=2, b=a++;	a=3;b=2;
–	自减（前置）	a=2, b=–a;	a=1;b=1;
–	自减（后置）	a=2, b=a–;	a=1;b=2;

• 四则混合运算，遵循 “先乘除后加减”的原则。
• 取模运算结果的正负取决于被模数（%左边的数）的符号。
• 尽量避免利用小数进行运算，有时可能因 JavaScript 的精度导致结果的偏差。
• “+”和“-”在算术运算时还可以表示正数或负数。
• 运算符（++或–）放在操作数前面，先进行自增或自减运算，再进行其他运算。若运算符放在操作数后面，则先进行其他运算，再进行自增或自减运算。
• 运算符（++或–）在前，口诀：先自增，后返值；运算符（++或–）在后，先返原值，后自增。
• 递增和递减运算符仅对数值型和布尔型数据操作，会将布尔值 true 当做 1，false 当做 0。
• 除了加法运算外，其余运算符进行相应数学运算并且在遇到非number值时，会全部转换成number值后再进行运算操作，此特性可用于隐式number类型转换
• 正号和负号，两者能够进行相应的数学运算同时在遇到非number的值时会将其强制转换成number值再进行运算，此特性可用于隐式number类型转换

4.2 字符串运算符

JavaScript中，“+”操作的两个数据中只要有一个是字符型，则“+”就表示字符串运算符，用于返回两个数据拼接后的字符串。

口诀：数值相加，字符相连

var color = 'blue';
var str = 'The sky is '+color;
var tel = 110 + '120';
console.log(str);                   	// 输出结果为：The sky is blue
console.log(tel);                   	// 输出结果为：110120
console.log(typeof str, typeof tel);	// 输出结果：string string

注意：利用字符串运算符“+”的特性，可以将布尔型、整型、浮点型或为 null 的数据，与空字符串进行拼接，就会完成字符型的自动转换。

4.3 赋值运算符

赋值运算符是一个二元运算符，即它有两个操作数。它将运算符右边的值赋给左边的变量。

运算符	运算	范例	结果
=	赋值	a=3, b=2;	a=3;b=2;
+=	加并赋值	a=3, b=2; a+=b;	a=5;b=2;
-=	减并赋值	a=3, b=2;a-=b;	a=1;b=2;
*=	乘并赋值	a=3, b=2;a*=b;	a=6;b=2;
/=	除并赋值	a=3, b=2;a/=b;	a=1.5;b=2;
%=	模并赋值	a=3, b=2;a%=b;	a=1;b=2;
+=	连接并赋值	a=‘abc’;a+=‘def’;	a=‘abcdef’;
**=	幂运算并赋值	a=2; a**= 5;	a=32;
<<=	左移位赋值	a=9,b=2;a <<= b;	a=36;b=2;
>>=	右移位赋值	a=-9,b=2;a >>= b;	a=-3;b=2;
>>>=	无符号右移位赋值	a=-9,b=2;a >>>= b;	a= 1073741821;b=2;
&=	按位与赋值	a=3,b=9;a &= b;	a=1;b=9;
^=	按位异或赋值	a=3,b=9;a ^= b;	a=10;b=9;
|=	按位或赋值	a=3,b=9;a |= b;	a=11;b=9;

注意：

• “=”是赋值运算符，而非数学意义上的相等的关系。
• 一条赋值语句可以对多个变量进行赋值。
• 赋值运算符的结合性为“从右向左”。

var a = b = c = 8;	
// 将5赋值给变量c
// 再把变量c的值赋值给变量b
// 把变量b的值赋值变量a，表达式赋值完成

var num1 = 2;
num1 += 3;	
// 等价于：
num1 = num1 + 3;

var num2 = '2';
num2 += 3;	
// 等价于：
num2 = num2 + 3;

4.4 比较运算符

用来对两个数值或变量进行比较。其结果是布尔类型的 true 或 false。

运算符	运算	范例	结果
==	等于	x == 4	false
!=	不等于	x != 4	true
===	全等	x === 5	true
!==	不全等	x !== ‘5’	true
>	大于	x > 5	false
>=	大于或等于	x >= 5	true
<	小于	x < 5	false
<=	小于或等于	x <= 5	true

注意：

• 不相同类型的数据进行比较时，首先会自动将其转换成相同类型的数据后再进行比较。
• 运算符“==”和“!=”运算符在比较时，只比较值是否相等。
• 运算符“=”与“!”要比较数值和其数据类型是否相等。

不同类型数据比较，规律如下：

类型	类型	比较方式	说明
对象型	对象型	比较是不是同一内存地址
对象型	字符型	对象先转化为字符型，再进行比较。
对象型	布尔型	两边都要先转为数值型，布尔类型false为0，true为1。对象类型先隐式调用toString方法，然后再调用Number()	alert([]==false); alert([]==0); alert([1]==1); alert([1]==true); alert([2]==true);
对象型	数值型	对象类型先转为数值型，再进行比较。对象类型先隐式调用toString方法，然后再调用Number()
数值型	布尔型	布尔型先转化为数值型，布尔类型false为0，true为1，再进行比较。
数值型	字符型	字符型先转化为数值型，再进行比较。
布尔型	布尔型	两边都要先转化为数值型，再进行比较。
null	undefined	true
null,undefined	其他类型	false	alert(nullfalse); alert(null0); alert(null==‘’);

4.5 逻辑运算符

是在程序开发中用于逻辑判断的符号。其返回值类型是布尔类型。

运算符	运算	范例	结果
&&	与	a && b	a和b都为true，结果为true，否则为false
||	或	a || b	a和b中至少有一个为true，则结果为true，否则为false
!	非	! a	若a为false，结果为true，否则相反

• 逻辑运算符的结合性是从左到右。
• 当使用“&&”连接两个表达式时，如果左边表达式的值为 false，则右边的表达式不会执行，逻辑运算结果为false。（短路）
• 当使用“||”连接两个表达式时，如果左边表达式的值为 true，则右边的表达式不会执行，逻辑运算结果为true。（短路）
• 逻辑运算符可针对结果为布尔值的表达式进行运算。
• 非运算：两次取非会得到原值的布尔值，此特性可用于隐式布尔类型转换。

4.6 三元运算符

三元运算符是一种需要三个操作数的运算符，运算的结果根据给定条件决定。

语法：条件表达式 ? 表达式1 : 表达式2

• 先求条件表达式的值。
• 如果为true，则返回表达式1的执行结果。
• 如果条件表达式的值为false，则返回表达式2的执行结果。

4.7 位运算符（了解）

是针对二进制数的每一位进行运算的符号。它专门针对数字0和1进行操作。

运算符	运算	范例	结果
&	按位与	a & b	a和b每一位进行“与”操作后的结果
|	按位或	a | b	a和b每一位进行“或”操作后的结果
~	按位非	~ a	a的每一位进行“非”操作后的结果
^	按位异或	a ^ b	a和b每一位进行“异或”操作后的结果
<<	左移	a << b	将a左移b位，右边用0填充
>>	右移	a >> b	将a右移b位，丢弃被移出位，左边最高位用0或1填充
>>>	无符号右移	a >>>b	将a右移b位，丢弃被移出位，左边最高位用0填充

JavaScript 中位运算符仅能对数值型的数据进行运算。在对数字进行位运算之前，程序会将所有的操作数转换成二进制数，然后再逐位运算。

JavaScript 中的数都是以4字节32位表示，一个字节8位。

有符号整数使用 31 位表示整数的数值，用第 32 位表示整数的符号，0 表示正数，1 表示负数。数值范围从 -2147483648 到 2147483647。

// 按位与
//   00000000 00000000 00000000 00001111 2^3+2^2+2^1+1=8+4+2+1=15
// & 00000000 00000000 00000000 00001001 2^3+1=9
// —————————————————————————------------
//   00000000 00000000 00000000 00001001 2^3+1=9

// 按位或
//   00000000 00000000 00000000 00001111
// | 00000000 00000000 00000000 00001001
// —————————————————————————------------
//   00000000 00000000 00000000 00001111

// 按位非
// 把运算数转换成 32 位数字
// 把二进制数转换成它的二进制反码
// 把二进制数转换成浮点数
// 实质上是对数字求负，然后减 1
// ~ 00000000 00000000 00000000 00001111
// —————————————————————————------------
//   11111111 11111111 11111111 11110000 -16

// 按位异或
// 不同为 1，相同为 0
//   00000000 00000000 00000000 00001111
// ^ 00000000 00000000 00000000 00001001
// —————————————————————————------------
//   00000000 00000000 00000000 00000110 2^2+2^1=6

// 左移
//   00000000 00000000 00000000 00001001 <<2
// —————————————————————————------------
//   00000000 00000000 00000000 00100100

// 右移
//   00000000 00000000 00000000 00001001 >>2
// —————————————————————————------------
//   00000000 00000000 00000000 00000010

// 无符号右移
//   00000000 00000000 00000000 00010011 >>>2
// —————————————————————————------------
//   00000000 00000000 00000000 00000100

4.8 运算符优先级

指的是在表达式中各个运算符参与运算的先后顺序（比如：先乘除，后加减）。

表中运算符的优先级由上至下递减。

结合方向	运算符
无	()
左	. [] new（有参数，无结合性）
右	new（无参数）
无	++（后置） --（后置）
右	! ~ -（负数） +（正数） ++（前置） --（前置） typeof void delete
右	**
左	* / %
左	+ -
左	<< >> >>>
左	< <= > >= in instanceof
左	== != === !==
左	&
左	^
左	|
左	&&
左	||
右	?:
右	= += = *= /= %= <<= >>= >>>= &= ^= |=
左	,

• 同一单元格的运算符具有相同的优先级。
• 左结合方向表示同级运算符的执行顺序为从左到右。
• 右结合方向则表示执行顺序为从右到左。
• 补充：圆括号()优先级别最高。例如， 4 + 3 * 2的 输出结果为10，(4 + 3) * 2的输出结果为14。

console.log( 4 >= 6 || '人' != '阿凡达' && !(12 * 2 == 144) && true)	// true

var a = 3 > 5 && 2 < 7 && 3 == 4; 
console.log(a); 	//false 

var b = 3 <= 4 || 3 > 1 || 3 != 2; 
console.log(b); 	//true

var c = 2 === "2"; 
console.log(c);  	//false

var d = !c || b && a ;
console.log(d);		//true

5 流程控制

5.1 选择结构

选择结构语句需要根据给出的条件进行判断来决定执行对应的代码。

5.1.1 if 单分支语句

if 条件判断语句也被称为单分支语句，当满足某种条件时，就进行某种处理。

// 只有年龄大于等于18周岁，才输出已成年，否则无输出。
// if ( 判断条件 ) {
//    代码段
// }

if(age >= 18){
    console.log('已成年');
}

5.1.2 if…else 双分支语句

if…else 语句也称为双分支语句，当满足某种条件时，就进行某种处理，否则进行另一种处理。

// 判断一个学生的年龄，大于等于18岁则是成年人，否则是未成年人。
// if ( 判断条件 ) {
//     代码段1;
// } else {
//     代码段2;
// }

if (age >= 18) {
    console.log('已成年');
} else {
    console.log('未成年');
}

5.1.3 if…else if…else 多分支语句

if…else if…else 语句也称为多分支语句，可针对不同情况进行不同的处理。

// 对一个学生的考试成绩进行等级的划分，分数在90~100分为优秀，分数在80~90分为优秀为良好，分数在70~80分为中等，分数在60~70分为及格，分数小于60则为不及格。
// if (条件1)  {
// 	代码段1;
// } else if(条件2)  {
// 	    代码段2;
// }
// ...
// else if(条件n)  {
// 	    代码段n; 	
// } else {	
// 	    代码段n+1;
// }

if (score >= 90) {
    console.log('优秀');
} else if (score >= 80) {
    console.log('良好');
} else if (score >= 70) {
    console.log('中等');
} else if (score >= 60) {
    console.log('及格');
} else {
    console.log('不及格');
}

注意：“if…else if…else”语句在使用时，“else if”中间要有空格，否则程序会报语法错误。

5.1.4 switch 多分支语句

switch 语句也是多分支语句，功能与 if 系列条件语句相同，不同的是它只能针对某个表达式的值作出判断，从而决定执行哪一段代码。

特点：代码更加清晰简洁、便于阅读。

// 根据学生成绩 score 进行评比（满分为100分）。
// switch (表达式) {
//     case 值1：代码段1; break;
//     case 值2：代码段2; break;
//         ...
//     default: 代码段n;
// }

switch (parseInt(score / 10)) {
    case 10:
    case 9:
        console.log('优');
        break;
    case 8:
        console.log('良');
        break;
    case 7:
        console.log('中');
        break;
    case 6:
        console.log('及格');
        break;
    case 5:
    case 4:
    case 3:
    case 2:
    case 1:
    default:
        console.log('差');
}

5.2 循环结构

所谓循环语句就是可以实现一段代码的重复执行。

5.2.1 while 循环

while 循环语句是根据循环条件来判断是否重复执行一段代码。

// 连续输出1~100之间的数字
// while ( 循环条件 ) {
//     循环体
//     ……
// }

var num = 1;
while (num <= 100) {
    console.log(num);
    num++;
}

注意：需要注意的是，若循环条件永远为 true 时，则会出现死循环，因此在开发中应根据实际需要，在循环体中设置循环出口，即循环结束的条件。

5.2.2 do…while 循环

do…while 循环语句的功能与 while 循环语句类似，唯一的区别在于，while 是先判断条件后执行循环体，而do…while 会无条件执行一次循环体后再判断条件。

// do {
//     循环体
//     ……
// } while (循环条件);

var num = 100;
do {
    console.log(num);
    num--;
} while (num >= 1)

5.2.3 for 循环

for 循环语句是最常用的循环语句，它适合循环次数已知的情况。

var num = 1;           // 初始化表达式
while (num <= 100) {   // 循环条件
    console.log(num);  // 循环体
    num++;             // 操作表达式
}

// for (初始化表达式;循环条件;操作表达式)
for (var num = 1; num <= 100; num++) {
    console.log(num);
}

for 关键字后面小括号“()”中包括了三部分内容：

• 初始化表达式
• 循环条件
• 操作表达式

它们之间用“;”分隔，{}中的执行语句为循环体。

注意：for 循环语句小括号“()”内的每个表达式都可以为空，但是必须保留分号分割符。当每个表达式都为空时，表示该for 循环语句的循环条件永远满足，会进入无限循环的状态，此时如果要结束无限循环，可在 for 语句循环体中用跳转语句进行控制。

let 关键字

• 在 ES6 中，可以通过 let 关键字声明一个块级作用域（可以理解为 {} 之间的代码）的本地变量。
• 它与 var 关键字的区别是，let 关键字在块级作用域内不能重复定义同名的变量，且该变量仅在块级作用范围内有效。

// let关键字
for (let i = 0; i < 3; ++i) {
}
// 输出结果：i is not defined
console.log(i); 

// var关键字
for (var i = 0; i < 3; ++i) {
}
// 输出结果为：3
console.log(i);

通过 let 定义的变量相比 var 来说，有一个更加清晰的作用范围，方便了变量的维护与控制。

5.3 跳转语句

跳转语句用于实现程序执行过程中的流程跳转。

常用的跳转语句：有 break 和 continue 语句。

break 与 continue 的区别

• break 语句可应用在 switch 和循环语句中，其作用是终止当前语句的执行，跳出 switch 选择结构或循环语句，执行后面的代码。
• continue 语句用于结束本次循环的执行，开始下一轮循环的执行操作。

break 和 continue 语句还可跳转到指定的标签语句处，实现嵌套语句的多层次跳转。

// 定义标签
label:statement
// 使用标签
break/continue  label;

outerloop:
for (var i = 0; i < 10; i++)
{
    innerloop:
    for (var j = 0; j < 10; j++)
    {
        if (j > 3)
        {
            break;
        }
        if (i == 2)
        {
            break innerloop;
        }
        if (i == 4)
        {
            break outerloop;
        }
        document.write("i=" + i + " j=" + j + "");
    }
}

• label 表示标签的名称，如 start、end 等任意合法的标识符。
• statement 表示具体执行的语句，如 if、while、变量的声明等。
• 标签语句必须在使用之前定义，否则会出现找不到标签的情况。

6 练习作业

• 根据平均分来划分等级

• 得到小明同学的各科平均成绩，如果大于等于90为优秀，小于90大于等于80为良好，小于80大于等于70为一般，小于70大于等于60为较差，小于60为很差

• 加油优惠价格计算

• 加油站实行多加多优惠政策，鼓励车主多加油
• 已知92号汽油，每升7.15元；如果大于等于20升，那么每升7.1
• 已知95号汽油，每升7.63元；如果大于等于40升，那么每升7.6
• 编写JS程序，用户输入自己的汽油编号，然后输入自己加多少升，弹出价格。

• 输出100以内的所有质数
• 判断一个数是否是素数（素数也叫作质数）
• 输入圆的半径计算面积和周长
• 三元运算符比较最大值
• while实现1-100相加求和
• while do…while验证用户名和密码
• 打印菱形、三角形
• 输出【100-999】中的水仙花数

• 水仙花数是指一个3位数，它的每个位上的数字的3次幂之和等于它本身，例如：1³⁺⁵3+3^3=153。

• 打印金字塔
• 九九乘法表
• 一百个和尚分一百个馒头，大和尚一人分三个，小和尚三人分一个，正好分完。问大、小和尚各几人？
• 公鸡一个五块钱，母鸡一个三块钱，小鸡三个一块钱，现在要用一百块钱买一百只鸡，问公鸡、母鸡、小鸡各多少只？

break outerloop;
  }
  document.write("i=" + i + " j=" + j + "");
  }
 }

- label 表示标签的名称，如 start、end 等任意合法的标识符。
- statement 表示具体执行的语句，如 if、while、变量的声明等。
- 标签语句必须在使用之前定义，否则会出现找不到标签的情况。



## 6 练习作业

- 根据平均分来划分等级
	- 得到小明同学的各科平均成绩，如果大于等于90为优秀，小于90大于等于80为良好，小于80大于等于70为一般，小于70大于等于60为较差，小于60为很差
- 加油优惠价格计算
	- 加油站实行多加多优惠政策，鼓励车主多加油
	- 已知92号汽油，每升7.15元；如果大于等于20升，那么每升7.1
	- 已知95号汽油，每升7.63元；如果大于等于40升，那么每升7.6
	- 编写JS程序，用户输入自己的汽油编号，然后输入自己加多少升，弹出价格。
- 输出100以内的所有质数
- 判断一个数是否是素数（素数也叫作质数）
- 输入圆的半径计算面积和周长
- 三元运算符比较最大值
- while实现1-100相加求和
- while do...while验证用户名和密码
- 打印菱形、三角形

- 输出【100-999】中的水仙花数
	- 水仙花数是指一个3位数，它的每个位上的数字的3次幂之和等于它本身，例如：1^3+5^3+3^3=153。

- 打印金字塔


- 九九乘法表

  <img src=")" alt="image-20220103232309923" />

- 一百个和尚分一百个馒头，大和尚一人分三个，小和尚三人分一个，正好分完。问大、小和尚各几人？

- 公鸡一个五块钱，母鸡一个三块钱，小鸡三个一块钱，现在要用一百块钱买一百只鸡，问公鸡、母鸡、小鸡各多少只？

- 红白球共25个，白黑球共31个，红黑球共28个，求三种球各有多少？求红白黑球的个数