《第4章Web脚本语言JavaScript》由会员分享，可在线阅读，更多相关《第4章Web脚本语言JavaScript（39页珍藏版）》请在金锄头文库上搜索。
1、第4章 Web脚本语言JavaScript,1. JavaScript语言概述 2. JavaScript编程基础 3. JavaScript中的对象 4. JavaScript程序流程控制 5. 函数 6. 事件和事件过程,1. JavaScript语言概述,一、JavaScript语言的特点 1、什么是JavaScript？JavaScript是一种脚本语言，可直接嵌入到HTML文档中，浏览器能理解其中的JavaScript语句，并在网页下载后对JavaScript语句进行解释执行。 JavaScript是在浏览器中解释执行的，具有平台无关性，不认什么操作系统，只要浏览器支持JavaScr
2、ipt即可。运用JavaScript可控制HTML页面，并对页面事件做出响应。,2、JavaScript语言与Java语言 Java是一种编译型语言，先通过Java编译器，将源程序编译成class，从而创建Java Applet或Java Application，然后客户浏览器将Java Applet下载后才能执行。Java Applet在页面中占用了一块区域，该区域与HTML其他部分完全独立，Java Applet在这块区域内完成它的功能。 JavaScript是一种解释型语言，它将源代码直接写入HTML页面中，不需要预先编译，浏览器将HTML下载后，则浏览器进行解释执行，JavaScrip
3、t并不在页面中占用空间，而是对HTML页面中的对象进行控制处理，在整个页面中完成它的功能。 Java是一种强类型语言，语法十分严谨，变量必须进行声明并指定其数据类型。而JavaScript是一种弱类型的语言，比Java自由得多。,3、JavaScript组成部分：由三个部分组成 JavaScript核心语言：包括JavaScript的基本语法：操作符、语句、函数及一些JavaScript内置的对象Array对象、Date对象和Math对象，JavaScript核心语句中定义的是在客户端和服务器端都会用到的基本语法。 JavaScript客户端扩展：在JavaScript核心语言基础上，扩展了控
4、制浏览器的对象和文本对象模型DOM(Document Object Model)。在客户端脚本中，可对页面上的对象进行控制，完成许多功能，如处理鼠标点击、表单输入等。 JavaScript服务器端扩展：在核心语言基础上扩展了在服务器上运行需要的对象，可与数据库互联，对服务器上文件进行控制等。 4、JavaScript的发展：P127,二、JavaScript程序的编辑和调试 在HTML代码中加入标签，也可加入SRC属性，使页面能调用写在源文件中的JavaScript函数，源文件中的函数可在多个页面间共享。如： 使用源文件可使用两种方式： 使用相对路径，SRC属性中是文件的相对路径。 使用URL
5、地址，SRC属性中是文件的URL地址。 使用SRC引用JavaScript源文件时，必须以.js为文件后缀名，并且在源文件中只能使用JavaScript代码而不能包含任何HTML标签。,2. JavaScript编程基础,一、数据类型 1、变量：有名称的单元就是变量。 2、变量的定义方式：用关键字var定义变量。JavaScript没有强制要求变量必须先定义才使用。在定义变量时，可将变量的定义和初始化分开完成，也可将变量的定义的初始化在一条语句中完成。 如声明一个变量但没有对其赋值，该变量存在且为undefined类型。不能在没有声明变量的情况下使用一个变量，这样会导致运行时产生错误。,3、变
6、量名称 定义的变量不能和保留字冲突。保留字是JavaScript中已经使用的单词或保留在以后的版本中可能使用的单词。 变量名必须以字母或下划线开始。 变量名不能包含空格。 JavaScript是区分大小写的。 4、数据类型：JavaScript不要求预先确定变量的数据类型，但每个JavaScript变量对应一个数据类型的值。JavaScript变量的数据类型可以发生变化。 字符串类型的变量所代表的值是处于引号内的一组字符。,数值类型：既可以代表整数又可代表小数。 布尔类型：只有真(true)和假(false)两种取值。 空类型：null，意味着什么也没有。注意JavaScript区分大小写，不
7、要将null和NULL混淆起来。 对象类型：JavaScript是基于对象的语言，如window等对象。这是对象类型的数据。 5、变量的作用域：每个变量都作用域。要函数内声明的变量只能在声明它们的函数中使用；函数外声明的变量在同一页内的任何脚本命令均可访问和修改该变量的值。,二、常量 1、整型常量：又称字面常量，是不能改变的数据，可使用十六进制、八进制和十进制表示。 2、实型常量：由整数部分加小数部分表示的量，可使用科学表示法或标准方法表示。 3、布尔值：只有true或false。 4、字符型常量：使用单引号或双引号括起来的若干个字符。 5、空值：null，表示什么也没有。 6、特殊字符：以反
8、斜杠()开头的不可显示的特殊字符。,三、运算符和表达式 1、比较操作符：、=、=、!= 2、运算操作符：+、-、*、/、%、+、-。 3、逻辑操作符： delete computer2; this操作符：用来引用当前的对象。,3. JavaScript中的对象,1、数组对象(Array) JavaScript没有数组数据类型，可使用数组对象完成数据的功能。 建立数组：有两种方法 建立数组的同时，将数组中的元素赋值。如： var computer=new Array(“mouse”,keyboard”,”cpu”,”harddisk”); 建立数组时，需定义数组的长度。如 var compute
9、r=new Array(3); 访问数组中元素：通过数组下标访问数组元素。下标从0开始，而数组的长度是数组中元素的个数。,数组对象的属性与方法 数组对象的length属性可获得数组的长度。 sort()方法：将数组元素排序。 reverse()方法：将数组中元素颠倒顺序，第一个元素和最后一个元素交换，第二个元素和倒数第二个元素交换，以此类推。 2、字符串对象(String) JavaScript中有字符串类型数据和字符串对象，定义方法分别是： s=”hello”;和var s=new String(“hello”); 但字符串变量和字符串对象在使用时没有太大区别，字符串变量可使用字符串对象的属
10、性和方法。,字符串对象的length，用来求字符串的长度。方法有： toUpperCase()和toLowerCase()方法：将字符串字母全部转换成大写字母和小写字母。 indexOF(子字符串)方法：有一个参数“子字符串”，功能是返回子字符串在字符串对象中的位置。如字符串对象中存在子字符串，返回其位置(如在字符串对象中有多个子字符串，返回第一个所在的位置)；如不存在，返回-1。注意：位置的下标是从0开始的。,charAt(位置)方法：有一个参数“位置”，功能是返回字符串对象中下标位置的字母。 substring(位置1，位置2)方法：返回从“位置1”到“位置2”之间的字符串。注意：返回的字
11、符串中位置2所在的字母不包括在内。 3、日期对象(Date) 在JavaScript中，日期对象中存储的不仅是日期数据，还包括时间数据。日期对象实际存储的是对象的时间相对1970年1月1日0时0分0秒的毫秒数，如对象代表的时间在1970年前，存储的是负数；如在1970年后，存储的是正数。 创建日期对象：格式为：var 对象名称=new Date(参数),根据参数的不同，可有多个方法生成日期对象： 没有参数时，使日期对象获得当前的日期和时间，如： var theDate=new Date(); 创建日期对象时，指定其中的年、月、日，如： var theDate=new Date(1999,1,1
12、); 日期对象是1999年2月1日，月份用0到11代表1月到12月。不指定时间，默认为0时0分0秒。 创建日期对象时，还可指定时间，如： var thaDate=new Date(1999,1,1,15,30,27);,日期对象的方法：下面的方法获得日期对象中各个部分： getYear()：获得日期对象的年份 getMonth()：获得日期对象的月份 getDate()：获得日期对象的日期 getHours()：获得日期对象的小时数 getMinutes()：获得日期对象的分种数 getSeconds()：获得日期对象的秒数 getDay()：返回日期对象处于星期几，返回值为0到6，代表星期日
13、到星期六。,设置日期对象的各个部分的方法有： setYear(年份)：设置日期对象的年份 setMonth(月份)：设置日期对象的月份 setDate(日期)：设置日期对象的日期 setHours(小时数)：设置日期对象的小时数 setMinutes(分钟数)：设置日期对象的分种数 setSeconds(秒数)：设置日期对象的秒数 setDay(星期几)：设置日期对象处于星期几,getTime()方法与setTime(毫秒数)方法 getTime()方法获得从1970年1月1日0时0分0秒开始的毫秒数。 SetTime()方法将毫秒数存储到日期对象中，在以后的运算中将这个日期对象各部分取出分别
14、处理。 4、数学对象(Math)：数学对象不需使用new操作符创建对象，可直接使用Math调用数学对象。数学对象的PI属性代表圆周率。方法有： min(值1，值2)和max(值1，值2)方法：返回两个数中较小或较大的数。 round(数值)、ceil(数值)和floor(数值)方法：功能都是将参数取整。区别是round将参数四舍五入后返回，ceil返回大于等于参数的最小整数，floor返回小于等于参数的最大整数。,random()方法：产生01的随机数。产生mn的随机整数的格式为：Math.round(Math.random()*(n-m)+m sqrt(数值)方法：返回数值的平方根。 abs
15、(数值)方法：返回数值的绝对值。 此外，还有sin(数值)、cos(数值)、tan(数值)、asin(数值)、acos(数值)和atan(数值)等方法，获得正弦值、余弦值、正切值、反正弦值、反余弦值和反正切值。注意：这里角度的数值采用弧度进行计算。,4. JavaScript程序流程控制,JavaScript中，每条语句后应以一个分号结尾，但JavaScript要求并不严格，语句后可加分号也可不加分号。 一、条件控制语句 1、ifelse语句格式： if(条件) 语句1 else 语句2 2、switch语句格式： switch(表达式) case 标签1：代码块1；break； case 标
16、签2：代码块2；break； default：缺省代码块；,二、循环控制语句 1、for语句格式： for(初始表达式；循环表达式；递增表达式) 代码块 2、while语句格式： while(循环条件) 代码地段 3、dowhile语句格式： do 代码块 递增表达式 while(循环条件),4、label语句格式： label：代码块 label语句只是在代码块前加上一个标识。 5、break语句：跳出循环体或switch语句。 Break语句还有一种使用方式：break label，执行到该语句时，立即跳出label标识的代码块。 6、continue语句：结束本次循环，开始下一轮循环。在while循环中，直接判断循环条件；在for循环中，先执行递增表达式，然后判断循环条件。 countinue也有countinue label使用方式，可在多重循环嵌套中，不仅终止当前循环的本轮循环，还能够终止外层循环的本轮运行，直接开始外层循环的下一轮运行。,7、其他语句 forInternet语句格式： for(变量 in 对象) 代码块 该语句中变量将会列举对象的每一个属性。 8、w
