3.2 JavaScript基本语法

JavaScript于1997年被ECMA（欧洲计算机制造联合会）采纳，被称为ECMAScript。同其他语言一样，JavaScript也有自己遵循的语言标准。

3.2.1 数据

1.数据类型

JavaScript拥有的数据类型包括：字符串、数字、布尔、数组、对象、函数、Null等。

（1）字符串（String）

字符串表示字符型数据。JavaScript不区分字符（Char）和字符串（String），用西文的单引号或双引号引用，引号中可以是任意文本。例如：

可以在字符串中使用引号，但不能匹配引用字符串的引号。例如：

（2）数字（Number）

数字表示数值型数据。JavaScript支持整数和浮点数，浮点数可以用小数点表示，也可用科学计数法表示。例如：

（3）布尔（Boolean）

布尔表示布尔型数据，其值只有true和false，不能用1和0表示。

（4）数组（Array）

数组由方括号引用，数组元素由西文逗号隔开，可以是数字，也可以是字符串。例如：

数组下标从0开始，数组可以为空。

（5）对象（Object）

对象由花括号引用，可以包含多个属性，用西文逗号隔开，每个属性以“名称:值”对的形式来定义。例如：

（6）函数（Function）

函数一般由函数名引用，函数会在后续章节中详细介绍。

（7）Null

Null表示空值或表示不含值。

2.常量和变量

（1）常量

常量是指在程序运行过程中保持不变的值。例如下列语句。

上例语句中，"HelloWorld! "就是一个字符串型常量。

（2）变量

变量是存放数据的容器。对于变量，需要了解变量的声明、变量的命名、变量的赋值、变量的数据类型等。

JavaScript使用关键字“var”声明变量，例如：

这里声明了一个名为“age”的变量。

JavaScript的变量名可以用字母和“$”“_”符号开头（为避免与jQuery混淆，不建议使用“$”），区分大小写，可以包含数字，变量名不能和关键字重合。

JavaScript的变量类型在给变量赋值时确定。例如：

这里将变量“age”通过赋值运算符“=”赋值为30，则该变量的数据类型为数值型。变量的申明和赋值也可以同时进行，例如：

JavaScript的变量是弱类型的，只需要申明一次，且变量类型可以随赋值的不同而改变。

3.2.2 操作符

操作符是表示数据间运算方式的符号，主要包括算术操作符、位操作符、赋值操作符、关系操作符、逻辑操作符等。

1.算术操作符

算术操作符用于执行数值间的算术运算，常用的算术运算符如表3-1所示。

表3-1 算术操作符

注意，对于运算符“+”，若是字符串相加，或字符串和数字相加，则是连接符。

2.位操作符

位操作符将操作数看作一串二进制位（0和1）进行运算，运算结果返回十进制数。常用的位操作符如表3-2所示。

表3-2 位操作符

3.赋值操作符

赋值操作符将右操作数赋值给左操作数。左操作数必须是变量。常见的赋值操作符如表3-3所示（设x=9）。

表3-3 赋值操作符

（续）

注意，对于操作符“+=”，若表达式中存在字符串，则是进行连接赋值操作。

4.关系操作符

关系操作符用于比较变量或常量的关系，结果返回布尔型值。常见的关系操作符如表3-4所示（设x=10）。

表3-4 关系操作符

注意，若是字符串比较，则是比较字符串的长度。

5.逻辑操作符

逻辑操作符用于布尔型值之间的操作。常见的逻辑操作符如表3-5所示。

表3-5 逻辑操作符

6.条件操作符

条件操作符的一般表达式是：

其含义是：若表达式expression运算结果为真，则variable=true_value；若表达式expression运算结果为假，则variable= false _value。

需要注意的是，当一个表达式有多个操作符时，需要注意操作符的优先级。

3.2.3 语句

在JavaScript脚本语言中，语句用西文分号“;”表示语句结束。

对于注释，JavaScript脚本语言的注释有两种方法。

方法一，注释语句行：在需要注释的一行语句前添加“//”，如【例3-1】中所示。

方法二，注释语句段：在需要注释的语句段的前后添加“/*”和“*/”，如下所示。

JavaScript脚本语言也有语句结构，常见的语句结构有顺序结构、分支结构、循环结构和函数。

1.顺序结构

顺序结构，就是按语句排列顺序来执行，此处不再赘述。

2.分支结构

在JavaScript脚本语言中，分支结构主要由if语句、if…else语句和switch语句实现。

（1）if语句

对一个条件进行二分判断，可使用if(…else)语句。

判断条件condition返回一个布尔值，为真则执行语句statement1（否则，执行statement2）。若有多条语句，应用花括号括起来。

例如判断一个分数（0～100）是否及格（≥60），见【例3-3】。

【例3-3】 if…else语句示例。

由于55<60，所以执行else下的语句。运行结果如图3-2所示。

图3-2 【例3-3】运行结果

（2）if…else if…语句

if…else if…语句的语法结构如下。

可使用if…else if语句对一个条件进行多值判断。例如，要判断一个分数（0～100）属于优（100～90）、良（89～80）、中（79～70）、及格（69～60）还是不及格（<60），功能代码见【例3-4】。

【例3-4】 if…else if语句示例。

执行此代码，会弹出如图3-3所示的弹窗。

图3-3 【例3-4】运行结果

（2）switch语句

当判断条件的值为数值或字符串等非布尔值时，可使switch语句。其语法结构如下。

表达式express的值与value1至valueN比较，相等时，执行其后相应的语句；若都不相等，执行default后的statement语句。方括号表示可缺省，缺省时表示即使已找到满足case的value，代码依旧往下执行。

例如，上述【例3-4】可写成如【例3-5】所示代码。

【例3-5】 switch语句示例。

其中，parseInt()函数可解析一个字符串，并返回一个整数。【例3-5】运行结果同【例3-4】。

3.循环结构

JavaScript语句中，循环结构主要由for语句、while语句和do…while语句实现。

（1）for语句

for语句可以实现按照指定的次数重复循环体，其语法结构如下。

其中，initial表示循环次数的计数初值，condition表示循环条件，step表示循环次数计数值的步进，statement表示循环体，多条语句需要用花括号括起来。

例如，求1累加到10的和，见【例3-6】。

【例3-6】 for语句示例1。

从0开始到10，循环体执行了11次，运行结果如图3-4所示。

for语句的循环条件，还可使用in语句限定循环次数，例如需要统计10个学生的平均成绩，见【例3-7】。

【例3-7】 for语句示例2。

其中，scores为10个学生成绩构成的数组，执行结果如图3-5所示。

图3-4 【例3-6】运行结果

图3-5 【例3-7】运行结果

（2）while语句

while语句语法结构如下。

while循环先判断条件condition，condition返回一个布尔值，为“true”时，执行循环体语句statement；为“false”时，退出循环体语句。

例如，求1累加到10的和，代码见【例3-8】。

【例3-8】 while语句示例。

运行结果同【例3-6】结果一致。

（3）do…while语句

do…while语句的语法结构如下。

do…while语句的循环体在条件判断前，所以无论条件是否满足，至少可以执行一次循环体语句，见【例3-9】。

【例3-9】 do…while语句示例。

运行上例代码，出现两个弹窗，第一个弹窗是循环体内的弹窗，单击“确定”，出现第二个循环体外的弹窗，如图3-6所示。

图3-6 【例3-9】运行结果

4.函数

将相同功能且多次执行的代码段构建成函数，可以简化、模块化程序。

（1）定义与调用

在JavaScript脚本语言中，函数的定义使用关键字“function”，语法结构如下。

“funct_name”是函数名，命名规则与变量名相同。圆括号内是可缺省的形参表，最多可以有255个。

函数的调用使用如下的语句结构直接调用。

圆括号内是可缺省的实参表。

（2）变量作用域

在函数中定义的变量为局部变量，只在此函数内有效。所以，不同函数内可以定义变量名相同的局部变量。在函数外部定义的变量为全局变量，当局部变量与全局变量重名时，需要辨别变量的作用域，如【例3-10】所示。

【例3-10】 局部变量和全局变量。

document.write()方法可以向网页文档输出内容，输出内容由圆括号内指定。运行结果如图3-7所示。

图3-7 【例3-10】运行结果

可以看出，函数中定义的局部变量，并不会影响全局变量，若函数未定义局部变量，使用的即为全局变量。