3.2 JavaScript语言_Dreamweaver+PHP+MySQL动态网站开发案例课堂-QQ阅读男生历史网

上QQ阅读APP看书，第一时间看更新

3.2 JavaScript语言

JavaScript是最初由网景公司推出的一种脚本语言，其目的是为了加强HTML的表达能力，提高网页的交互性，增进客户端网页上处理数据与运算的能力。

3.2.1 JavaScript概述

JavaScript一般情况下是与HTML结合在一起使用的，嵌入在HTML或PHP文件中。在HTML代码中，必须使用<script>标记，才能使用脚本语言，格式如下：

<script>
   语言主体信息
</script>

例如，可以用一个JavaScript语句将一段欢迎词写入HTML页面中，代码如下：

<script language="JavaScript">
   document.Write("你好！欢迎你开始学习JavaScript语言");
</script>

从上面的代码可以看出，JavaScript代码是成双成对出现在<script>标记中的，也就是说，代码从<script>开始，到</script>结束。其中，language属性代表的是脚本语言。

脚本语言可以出现在HTML中的任何位置。上述代码中的document是对象，Write是document对象中的方法。

3.2.2 JavaScript的基本语法

JavaScript可以直接用记事本来编写，其中包括语句、由语句构成的语句块以及注释。在一条语句内可以使用变量、表达式等。

这里我们将介绍相关的编程语法基础。

JavaScript程序按照在HTML文件中出现的顺序逐行执行。如果需要在整个HTML文件中执行，最好将其放在HTML文件的<head>...</head>标记中。某些代码，如函数体内的代码，不会被立即执行，只有当所在的函数被其他程序调用时，该代码才被执行。

JavaScript对字母大小写敏感，也就是说，在输入语言的关键字、函数、变量以及其他标识符时，一定要严格区分字母的大小写。例如变量username与变量userName是两个不同的变量。

提示

HTML不区分大小写。由于JavaScript与HTML紧密相关，这一点很容易混淆，许多JavaScript对象和属性都与其代表的HTML标签或属性同名，在HTML中，这些名称可以以任意的大小写方式输入而不会引起混乱，但在JavaScript中，这些名称通常都是小写的。例如，在HTML中的事件处理器属性ONCLICK通常被声明为onClick或Onclick，而在JavaScript中只能使用onclick。

在JavaScript语句中，分号是可有可无的，这一点与Java语言不同，JavaScript并不要求每行必须以分号作为语句的结束标志。如果语句的结束处没有分号，JavaScript会自动将该代码的结尾作为语句的结尾。

例如，下面的两行代码书写方式都是正确的：

Alert("hello,JavaScript")
Alert("hello,JavaScript");

提示

建议培养良好的编写习惯，最好在每行的最后加上一个分号，这样就能保证每行代码既正确、又美观。

另外，JavaScript会忽略多余的空格，用户可以向脚本添加空格，来提高其可读性。下面的两行代码是等效的：

var name="Hello";
var name = "Hello";

当一段代码比较长时，用户可以在文本字符串中使用反斜杠对代码行进行换行。下面的例子会正确地显示：

document.write("Hello \
World!");

不过，用户不能像这样折行：

document.write \
("Hello World!");

注释通常用来解释程序代码的功能（增加代码的可读性）或阻止代码的执行（调试程序），不参与程序的执行。在JavaScript中，注释分为单行注释和多行注释两种。

（1）单行注释语句：在JavaScript中，单行注释以双斜杠“//”开始，直到这一行结束。单行注释标记“//”可以放在行的开始或一行代码的末尾，但无论放在哪里，只要是从“//”符号开始到本行结束为止的所有内容，就都不会执行。在一般情况下，如果“//”位于一行的开始，则用来解释下一行或一段代码的功能；如果“//”位于一行代码的末尾，则用来解释当前行代码的功能。如果用来阻止一行代码的执行，也常将“//”放在一行的开始。

（2）多行注释语句：单行注释语句只能注释一行的代码，假设在调试程序时，希望有一段代码都不被浏览器执行或者对代码的功能说明一行书写不完，那么，就需要使用多行注释语句。多行注释语句以“/*”开始，以“*/”结束，可以注释掉一段代码。

JavaScript程序是语句的集合，一条JavaScript语句相当于英语中的一个完整句子。JavaScript语句将表达式组合起来，完成一定的任务。一条语句由一个或多个表达式、关键字或运算符组合而成，语句之间用分号（;）隔开，即分号是一个JavaScript语句的结束符号。

下面给出JavaScript语句的分割示例，其中一行就是一条JavaScript语句：

name = "张三";          //将字符串“张三”赋值给name
var today = new Date();        //将今天的日期赋值给today

语句块是一些语句的组合，通常，语句块都会被一对大括号括起来。在调用语句块时，JavaScript会按书写次序执行语句块中的语句。JavaScript会把语句块中的语句看成是一个整体全部执行，语句块通常用在函数中或流程控制语句中，如下所示的代码就是一个语句块：

if (Fee < 2)
{
   Fee = 2; //小于2元时，手续费为2元
}

语句块的作用是使语句序列一起执行。JavaScript函数是将语句组合在块中的典型例子。

3.2.3 JavaScript的数据结构

每一种计算机编程语言都有自己的数据结构，JavaScript脚本语言的数据结构包括标识符、常量、变量、关键字等。

用JavaScript脚本语言编写程序时，很多地方都要求用户给定名称，例如，JavaScript中的变量、函数等要素，定义时都要求给定名称。可以将定义要素时使用的字符序列称为标识符。这些标识符必须遵循如下命名规则：

●标识符只能由字母、数字、下划线和中文组成，而不能包含空格、标点符号、运算符等其他符号。

●标识符的第一个字符必须是字母、下划线或者中文。

●标识符不能与JavaScript中的关键字名称相同，如if、else等。

例如，下面为合法的标识符：

UserName
Int2
_File_Open
Sex

下面为不合法的标识符：

99BottlesofBeer
Namespace
It's-All-Over

关键字通常标识了JavaScript语句的开头和结尾。

表3.5列出了JavaScript中的关键字。

表3.5 JavaScript中的关键字

提示

JavaScript关键字是不能作为变量名和函数名使用的。

保留字是为将来的关键字而保留的单词，因此保留字不能被用作变量名或函数名。

表3.6列出了JavaScript中的保留字。

表3.6 JavaScript中的保留字

提示

如果将保留字用作变量名或函数名，那么除非将来的浏览器实现了该保留字，否则很可能收不到任何错误消息。当浏览器将其实现后，该单词将被看作关键字，如此将出现关键字错误。

常量是字面变量，是固化在程序代码中的信息，常量的值从定义开始就是固定的。常量主要用于为程序提供固定和精确的值，包括数值和字符串，如数值、逻辑值真（true）、逻辑值假（false）等，都是常量。

常量通常使用const来声明。语法格式如下：

const
 常量名 : 数据类型 = 值;

变量，顾名思义，在程序运行过程中，其值可以改变。变量是存储信息的单元，它对应于某个内存空间，变量用于存储特定数据类型的数据，用变量名代表其存储空间。程序能在变量中存储值和取出值，可以把变量比作超市的货架（内存），货架上摆放着商品（变量值），可以把商品从货架上取出来（读取），也可以把商品放入货架（赋值）。

1．变量的命名

实际上，变量的名称是一个标识符。在JavaScript中，用标识符来命名变量和函数，变量的名称可以是任意长度。创建变量名称时，应该遵循以下命名规则：

●第一个字符必须是一个ASCII字符（大小写均可）或是一个下划线（_），但是，不能是数字。

●后续的字符必须是字母、数字或下划线。

●变量名称不能是JavaScript的保留字。

●JavaScript的变量名是严格区分大小写的。例如，变量名称myCounter与变量名称MyCounter是不同的。

下面给出一些合法的变量命令示例：

_pagecount
Part9
Numer

下面给出一些错误的变量命名示例：

12balloon           //不能以数字开头
Summary&Went                   //“与”符号不能用在变量名称中

2．变量的声明与赋值

JavaScript是一种弱类型的程序设计语言，变量可以不声明而直接使用。所谓声明变量，即为变量指定一个名称。声明变量后，就可以把它们用作存储单元了。

在JavaScript中，使用关键字“var”来声明变量，在这个关键字之后的字符串将代表一个变量名。其格式为：

var 标识符;

例如，声明变量username，用来表示用户名，代码如下：

var username;

另外，用一个关键字var也可以同时声明多个变量名，多个变量名之间必须用逗号“,”分隔。

例如，同时声明变量username、pwd、age，分别表示用户名、密码和年龄，代码如下：

var username, pwd, age;

要给变量赋值，可以使用JavaScript中的赋值运算符，即等号（=）。

声明变量名时同时赋值，例如，声明变量username，并赋值为“张三”，代码如下：

var username = "张三";

声明变量后，可以对变量赋值。或者也可以对未声明的变量直接赋值。

例如，声明变量age，然后再为它赋值，以及直接对变量count赋值：

var age;    //声明变量
age = 18;    //对已声明的变量赋值
count = 4;    //对未声明的变量直接赋值

提示

JavaScript中的变量如果未初始化（赋值），默认值为undefined。

3．变量的作用范围

所谓变量的作用范围，是指可以访问该变量的代码区域。JavaScript中，按变量的作用范围，分为全局变量和局部变量。

●全局变量：可以在整个HTML文档范围中使用的变量，这种变量通常都是在函数体外定义的变量。

●局部变量：只能在局部范围内使用的变量，这种变量通常都是在函数体内定义的变量，所以只能在函数体中有效。

提示

省略关键字var声明的变量，无论是在函数体内，还是在函数体外，都是全局的变量。

3.2.4 JavaScript的数据类型

每一种计算机语言都有自己所支持的数据类型。在JavaScript脚本语言中，采用的是弱数据方式，即一个数据不必首先做声明，可以在使用或赋值时再确定其数据的类型，当然，也可以先声明该数据类型。

1．Undefined类型

Undefined是未定义类型的变量，表示变量还没有赋值，如var a;，或者赋予一个不存在的属性值，例如var a = String.notProperty;。

此外，JavaScript中有一种特殊类型的数字常量NaN，表示“非数字”，当在程序中由于某种原因发生计算错误后，将会产生一个没有意义的数值，此时，JavaScript返回的数字值就是NaN。

2．Null类型

JavaScript中的关键字Null是一个特殊的值，表示空值，用于定义空的或不存在的引用。不过，Null不等同于空的字符串或0。由此可见，Null与Undefined的区别是：Null表示一个变量被赋予了一个空值，而Undefined则表示该变量还未被赋值。

3．Boolean类型

布尔类型Boolean表示一个逻辑数值，用于表示两种可能的情况。逻辑真，用true表示；逻辑假，用false来表示。通常，我们使用1表示真，0表示假。

4．Number类型

JavaScript的数值类型可以分为4类，即整数、浮点数、内部常量和特殊值。整数可以为正数、0或者负数；浮点数可以包含小数点、也可以包含一个“e”（大小写均可，在科学记数法中表示“10的幂”），或者同时包含这两项。整数可以以10（十进制）、8（八进制）和16（十六进制）作为基数来表示。

5．String类型

字符串是用一对单引号（‘’）或双引号（“”）和引号中的部分构成的。一个字符串也是JavaScript中的一个对象，有专门的属性。引号中间的部分可以是任意多的字符，如果没有，则是一个空字符串。如果要在字符串中使用双引号，则应该将其包含在使用单引号的字符串中，使用单引号时则相反。

6．Object类型

前面介绍的5种数据类型是JavaScript的原始数据类型，而Object是对象类型。该数据类型中包括Object、Function、String、Number、Boolean、Array、Regexp、Date、Global、Math、Error，以及宿主环境提供的object类型。

3.2.5 JavaScript的运算符

在JavaScript的程序中，要完成各种各样的运算，是离不开运算符的。运算符用于将一个或几个值进行运算，而得出所需要的结果值。在JavaScript中，按运算符类型，可以分为算术运算符、比较运算符、逻辑运算符、条件运算符和赋值运算符等。

（1）算术运算符是最简单、最常用的运算符，所以有时也称为简单运算符，可以使用它们进行通用的数学计算。

JavaScript语言中提供的算术运算符有+、-、*、/、%、++、--，共7种。分别表示加、减、乘、除、求余数、自增和自减。其中+、-、*、/、%为二元运算符，表示对运算符左右两边的操作数做算术运算，其运算规则与数学中的运算规则相同，即先乘除后加减。++、--两种运算符都是一元运算符，其结合性为自右向左，在默认情况下，表示对运算符左边的变量的值增1或减1，而且它们的优先级比其他算术运算符高。

算术运算符的说明及示例如表3.7所示。

表3.7 算术运算符

（2）比较运算符用于对运算符的两个表达式进行比较，然后根据比较结果，返回布尔类型的值true或false，例如，比较两个值是否相同或比较两个数值的大小等。

在表3.8中，列出了JavaScript支持的比较运算符。

表3.8 比较运算符

任何信息在计算机中都是以二进制的形式保存的。位运算符就是对数据按二进制位进行运算的运算符。JavaScript语言中的位运算符有与&、或|、异或^、取补~、左移<<、右移>>。其中，取补运算符为一元运算符，而其他的位运算符都是二元运算符。这些运算都不会产生溢出。位运算符的操作数为整型，或者是可以转换为整型的任何其他类型。

表3.9列出了JavaScript支持的位运算符。

表3.9 位运算符

（3）逻辑运算符通常用于执行布尔运算，它们常与比较运算符一起使用，来表示复杂的比较运算，这些运算涉及的变量通常不止一个，而且常用于if、while和for语句中。

表3.10列出了JavaScript支持的逻辑运算符。

表3.10 逻辑运算符

（4）除了上面介绍的常用运算符外，JavaScript还支持条件表达式运算符“?”，这个运算符是个三元运算符，它有三个部分，一个计算值的条件和两个根据条件返回的真假值。格式如下所示：

条件? 表达式1 : 表达式2

在使用条件运算符时，如果条件为真，则结果使用表达式1的值，否则使用表达式2的值。示例如下：

(x>y)? 100*3 : 11

如果x的值大于y值，则表达式的值为300；否则x的值小于或等于y值时，表达式的值为11。

（5）赋值就是把一个数据赋值给一个变量。例如，myName=“张三”的作用是执行一次赋值操作，把常量“张三”赋值给变量myName。赋值运算符为二元运算符，要求运算符两侧的操作数类型必须一致。

JavaScript中提供有简单赋值运算符和复合赋值运算符两种。表3.11列出了JavaScript支持的赋值运算符。

表3.11 赋值运算符

提示

在书写复合赋值运算符时，两个符号之间一定不能有空格，否则将会出错。

运算符的种类非常多，通常不同的运算符又构成了不同的表达式，甚至一个表达式中又包含有多种运算符，因此，它们的运算方法应该有一定的规律性。JavaScript语言规定了各类运算符的运算级别及结合性等，如表3.12所示。

表3.12 运算符的优先级

3.2.6 JavaScript的表达式

表达式是一个语句的集合，像一个组一样，计算结果是个单一值，然后，该结果被JavaScript归入下列数据类型之一：布尔型、数字型、字符串、对象等。

一个表达式本身可以是一个数值或者变量，或者它可以包含许多连接在一起的变量关键字以及运算符。

1．赋值表达式

在JavaScript中，赋值表达式的一般语法形式为：

变量 赋值运算符 表达式

在计算过程中，是按照自右而左结合的。其中有简单的赋值表达式，如i=1；也有定义变量时，给变量赋初始值的赋值表达式，如var str = “Happy World！”；还有使用比较复杂的赋值运算符连接的赋值表达式，如k+=18。

2．算术表达式

算术表达式就是用算术运算符连接的JavaScript语句单位。如i+j+k、20-x、a*b、j/k、sum%2等，即为合法的算术运算符的表达式。算术运算符的两边必须都是数值，若在“+”运算中存在字符或字符串，则该表达式将是字符串表达式，因为JavaScript会自动地将数值型数据转换成字符串型数据。例如，下面的表达式将被看作是字符串表达式：

"好好学习" + i + "天天向上" + j

3．布尔表达式

布尔表达式一般用来判断某个条件或者表达式是否成立，其结果只能为true或false。

4．字符串表达式

字符串表达式是操作字符串的JavaScript语句。JavaScript的字符串表达式只能使用“+”与“+=”两个字符串运算符。如果在同一个表达式中既有数字又有字符串，同时还没有将字符串转换成数字的方法，则返回值一定是字符串型的。