JavaScript对象编程.docx

1、JavaScript对象编程第4章 JavaScript对象编程JavaScript中最重要的特性之就是能够使用对象，并具有创建对象的能力。虽然JavaScript是基于对象的语言，没有提供像抽象、继承、重载等有关面向对象语言的许多功能，但是它还是具有一些面向对象的基本特征，从而进一步扩大JavaScript的应用范围，增强了Web文档的编写功能。4.1 对象的基本概念4.1.1 对象的基本概念JavaScript中的对象是由属性(Properties)和方法(methods)两个基本要素构成的，它具有一个唯一的识别标志来确定一个对象。属性是描述对象状态的一组数据，它定义了对象的外观和行为，从

2、而与变量相关联。方法是指对对象的操作过程，它让对象执行一定的动作和任务，从而与特定的函数相关联。例如日常生活中，学生可以看成一个对象，他包含有学号、姓名、成绩等属性，当需要求出学生的平均成绩时，需要对学生成绩进行运算，这就需要运算的方法。一个对象在被引用（操作）之前，这个对象必须是存在的，否则引用将毫无意义，并且会出现提示引用错误的信息。要引用一个对象可以采用内置对象、浏览器对象和自定义对象这三种方式之一。内置对象：JavaScript将一些最常用、最基本的功能预先定义成对象，用户可以直接使用这些对象，这些内置对象的详细描述见4.2节JavaScript的内置对象。浏览器对象：由浏览器根据系统

3、当前的配置和所装载的页面为JavaScript提供一些可供使用的对象，例如前面在例子中曾经使用过的document对象。自定义对象：编程人员根据需要而创建的新对象。因此，JavaScript引用对象可通过创建新的对象，或者利用已有的对象来实现。4.1.2 对象的操作通过访问或设置对象的属性，调用对象的方法，就可以对对象进行各种操作，从而获得需要的功能。1. 创建对象（new运算符）JavaScript中对于对象的属性与方法引用有两种情况：如果对象是静态对象，在引用该对象的属性与方法时，可以直接引用而不需要为它创建实例；如果对象是动态对象，则在引用该对象的属性与方法时，必须为它创建一个实例。语法

4、如下：newobject = new object其中object为已存在的对象；newobject：为新创建的对象（实例）。请注意大小写的对象名是不同的对象。例如创建一个日期新实例：newdate=new Date() ; /经过创建后，就可以把newdate作为一个对象使用。birthday=new Date(January 21, 2007) ; /经过创建后，就可以把birthday 作为一个对象使用。2. 对象属性的引用对象属性的引用是通过对象名与属性名的组合来访问的。例如已经存在了一个对象person，该对象有name、sex和age三个属性，对这些属性的引用可以用如下3种方式：在

5、所需要操作的对象名后面加上句点“.”和属性名。persion.name=李小东 ;persion.sex=男 ;persion.age=20 ;。可以采用对象的数组下标的形式：person0=李小东 ;person1=男 ;person2=20 ;。或者通过字符串的形式实现：personname=李小东 ;personsex=男 ;personage=20 ;。3. 对象方法的引用对象方法的引用与对象属性的引用相似。只需在对象和方法之间用句点分隔就可指明该对象的某一种方法，并加以引用。其语法如下：对象名.方法例如计算半径为r的圆的面积，可以使用Math对象的PI属性来获得圆周率，使用Math对

6、象的pow方法来获得r的平方，语句为：s= Math.PI*Math.piw(r,2)。4. this关键字this用于引用当前对象。在JavaScript中存在着对象的嵌套引用，例如对象A的引用需要用对象B的引用，而对象B有可能又要引用对象C。这样嵌套调用有可能造成混乱，使得程序编写人员自己也忘记了现在引用的是哪一个对象。为此JavaScript提供this语句用于将对象指定为当前对象，该语句特别适用于创建自定义对象的场合。5. with语句在调用某个对象的方法和获取属性时，可以通过with语句告诉JavaScript语言你正在使用的对象，而无须特别指定这个对象就可以调用对象的属性和方法。当

7、需要对一个对象进行大量的操作时，通过使用with语句来替代一连串的“对象名”，从而节省了不少代码。语法：with object ; /语句组，所有在with语句后的花括号中的语句，都是with后面object对象的作用域。该语句的功能是：申明一个对象object，在该语句体内对变量的操作被认为是对这个对象的属性进行的操作。例如计算圆的面积时，使用下列语句可以避免每次都需要书写Math对象名。with Math PI*pow(r,2) ; ; /使用Math对象的其它语句6. for in语句for in语句是一种特殊的循环，用于对已知对象的所有属性进行操作的循环控制，它从头到尾处理该对象的所有

8、属性，使用如下语句创建循环。语法：for(变量 in 对象名) ; / 语句组每当执行循环语句时，则按对象的属性名依次替换变量来执行语句组。该语句结束循环不是根据循环条件，而是根据对象中定义的属性个数执行语句组，因此该语句特别适用于处理未知属性个数的对象。例4-1 下列脚本程序exa4_1.htm用for in循环语句列出了当前窗口的所有属性，窗口属性见5.2.1节。 for (i in window) document.write(Window.+i+=+windowi+) ; 7. delete语句delete语句可以删除一个对象的实例（一般delete语句比较少使用）。其语法如下：del

9、ete 对象名 ;4.2 内置对象4.2.1 Math对象Math对象用于算术运算，Math对象的属性是数学中的常用常量，而Math对象的方法是数学运算中的常用数学函数。Math对象是一个静态对象，所以在使用它的属性与方法时并不需要创建它的实例。1. Math对象的属性Math对象的属性见表4-1，它们是一些常用的数学常数。例如圆周率乘以2的平方根可以写成：Math.PI*Math.SQRT2。表4-1 Math对象的属性属 性说 明E自然对数的底，用于算术运算LN22的自然对数，用于自然对数与底为2的对数转换LN1010的自然对数，用于对数转换LOG2E以2为底的自然对数E的对数，用于自然对

10、数与底为2的对数转换LOG10E以10为底的自然对数E的对数，用于自然对数与底为10的对数转换PI圆周率SORT1_21/2的平方根SQRT22的平方根2. Math对象的方法Math对象的方法有18个，如表4-2所示。表4-2 Math对象的方法方 法说 明方 法说 明abs(x)返回x的绝对值log(x)返回x的自然对数acos(x)返回x的反余弦值max(x,y)返回x,y中的最大值asin(x)返回x的反正弦值min(x,y)返回x,y中的最小值atan(x)返回x的反正切值pow(x,y)返回x的y次方atan2(x,y)返回由X轴到(y,x)点的角度(以弧度为单位)random()

11、返回一个0到1之间的伪随机数ceil(x)返回大于等于x的最小整数round(x)返回x四舍五入的取整值cos(x)返回x的余弦值sin(x)返回x正弦值exp(x)返回自然对数E的x次方Sqrt(x)返回x的平方根floor(x)返回小于等于x的最大整数tan(x)返回x的正切值例4-2 下列脚本程序eax4_2.htm显示两个10以内自然数相乘的算式，让用户输入乘积并判断计算结果是否正确。 var x, y,s= ; x=Math.floor(Math.random()*10) ; y=Math.floor(Math.random()*10) ; s=parseInt(prompt(x+y

12、+=,s); /输入数据并转换成数值型 if (s=x*y) alert(答对了!) ; else alert(答错了!) ;程序先利用随机函数random产生01之间的随机数据，乘以10后用取整函数floor转换成09之间的自然数x与y。promp函数用于产生用户输入，等待用户从键盘输入计算结果；而parseImt函数把用户输入的数据转换成数值。然后再比较用户输入的结果与计算机计算的结果是否相等（s=x*y），并根据比较结果给出相应的提示。promp函数语法见5.2节“窗口对象”。4.2.2 Date对象1. Date对象的方法Date对象主要提供获取（get）和设置（set）日期和时间的方

13、法、处理时区问题的方法以及日期格式转换的方法。使用get方法从Date对象中获取日期、时间，这是获取这些值的唯一方法，因为这些值不是对象的属性。使用set方法设置Date对象的年、月、日、时、分、秒、毫秒等各部分的值。UTC即Universal Coordinated Time，就是早期的格林威治标准时间（GMT）。Date对象的方法如表4-3所示。表4-3 Date对象的方法方 法说 明时区getDate()/setDate(x)getUTCDate()/setUTCDate(x)获取/设置日期值，131的整数值表示131日指定时区格林威治时间getDay()getUTCDay()获取星期的

14、整数值，06分别表示星期天、一六指定时区格林威治时间getMonth()/setMonth(x)getUTCMonth()/setUTCMonth()获取/设置月份值，011的整数值表示112月份指定时区格林威治时间getFullyear()/setFullyear()getUTCFullYear()/setUTCFullYear()获取/设置完整年份值，4位整数指定时区格林威治时间getYear()/setYear(x)获取/设置日期的年份，2位整数指定时区getHours()/setHours(x)getUTCHours()/setUTCHours()获取/设置时间023的整数小时值指定时

15、区格林威治时间getMinutes()/setMinutes(x)getUTCMinutes()/setUTCMinutes()获取/设置时间059的整数分钟值指定时区格林威治时间getSeconds()/setSeconds(x)getUTCSeconds()/setUTCSeconds()获取/设置时间059的整数秒钟值指定时区格林威治时间getMilliseconds()/setMilliseconds(x)getUTCMilliseconds()/setUTCMilliseconds(x)获取/设置时间0999的毫秒数指定时区格林威治时间getTime()/setTime(x)获取/设

16、置一个毫秒整数值，自1970年1月1日算起指定时区getTimezoneOffest()返回整数表示当地时区与格林威治时间的偏差数格林威治时间toGMTString()toLocaleString()toString 使用GMT时间将日期对象的时间值转换为文本使用当地时间将日期对象的时间值转换为文本，返回日期的字符串表示,其格式采用Month,day year hh:mm:ss格林威治时间指定时区指定时区Date.parse(日期字串)把字符串的日期形式转换成Date对象（距1970年1月1日的毫秒数）指定时区Date.UTC()将一个Date对象（毫秒数）转换为一个UTC(GMT)时间格林威

17、治时间2. 创建Date对象Date对象是动态对象，因此使用它之前必须先使用new运算符创建它。创建Data对象的常见方式有三种。语法：var tempDate=new Date() ; var tempdate=new Date(year,month,day,hours,minutes,seconds,ms) ; var tempdate=new Date(milliseconds) ; 说明：如果新建日期对象时不包含任何参数，得到的是当前的日期。如果使用“日期字符串”作为参数，其格式可以使用像”June 12,2000”，”3/27/1984 13:23:05”，”Sat Feb 3 10

18、:43:56 EDT 2007”等格式。如果使用“年,月,日,时,分,秒,毫秒”作为参数，这些参数都应是整数，其中“月”从0开始计算。方括号中的参数可以不填写，其值就表示零。如果使用“毫秒”作为参数，该数代表从1970年1月1日至指定日期的毫秒数值。新建日期得到的结果是标准的日期字串格式，如果没有指定时区，将返回当地时区的时间。例如var mydate=new Date(2007,3,12);语句创建了一个mydate对象，其日期为2007年3月12日，时间为0点05分0秒0毫秒。而var mydate=new Date(2007,3,12,8,25,35,100);语句创建了一个mydate

19、对象，其日期为2007年3月12日，时间为8点25分35秒100毫秒。又如var thedate=new Date(2007,1,20) ;或var thedate=new Date(“2007,1,20”) ; /都将创建一个thedate对象，其日期值为2007年1月20日。例4-3 下列脚本程序exa4_3.htm演示了日期对象的一些使用方式。 var olddate=new Date() ; document.writeln(当地日期时间：+olddate.toLocaleString()+) ; var newdate =new Date() ; newdate.setYear(19

20、98) ; newdate.setMonth(5); /注意设置月份的值是从0到11 newdate.setDate(23) ; /注意设置日期的值是从1到31 document.write(新的日期时间：+newdate.toLocaleString()+) ; t1=new Date(); document.write(执行前的时刻是：+t1.toLocaleDateString()+); var sum,i ; for (i=0;i500000;i+) sum+=i ; var t2=new Date() ; document.write(执行结束时刻是：+t2.toLocaleDate

21、String()+); document.writeln(执行所花的时间是：+(t2.getTime()-t1.getTime()+毫秒) ; 程序中有一段用于计算循环执行时间的代码，其原理是在程序执行前读取系统的时间，然后再执行循环程序，当循环程序执行结束后，读取系统的时间，把前后两个时间相减即可近似地获得循环程序的执行时间。程序执行结束后，在屏幕上显示出：当地日期时间：2007年2月8日 14:46:39新的日期时间：1998年6月23日 14:46:39执行前的时刻是：2007年2月8日执行结束的时刻是：2007年2月8日执行所花的时间是：902毫秒4.2.3 String对象Strin

22、g对象提供了对字符串进行处理的属性和方法，String对象是一个静态对象，所以使用它时也可以不必为其创建实例。任何字符串变量或者被引用的字符串常量都是一个String对象。1 String对象的属性String对象的属性见表4-4，其中常用属性是length属性。length属性表示字符串中字符的个数，所统计的个数包括空格、汉字和特殊符号。表4-4数组对象的属性属 性说 明属 性说 明constructor字符串对象的函数原型length字符串的长度prototype允许对一个对象类型定义其它属性和方法2 String对象的方法String对象的方法如表4-5所示。若字符串的长度为n，则该字符

23、串中字符的位置顺序号从0到n-1。字符串的操作是编程过程中经常碰到的操作，从程序员编写程序的角度考虑，必须熟悉并熟练掌握string对象的属性和方法。应特别注意字符搜索、字符截取、字符串转换为数组等操作，它们在今后的编程中有很实用的价值。例如在需要处理一个项目列表时, split方法是非常有效的。表4-5 String对象的方法方 法说 明anchor(nameAttribute)该方法(锚点)类似于HTML文档中的anchor标识big()用大字体显示字符串blink()字符串闪烁显示bold()字符串用粗体显示charAt(index)返回字符串中下标值为index处的字符，index从0

24、开始fixed()字符串以固定高度的字体显示fontcolor(color)用特定的颜色(color)显示字符串fontsize(size)指定基于基本字体(默认为3号)大小的字体，size可以使用(17)。indexOf(character,start)从start位置(可以省略)开始向后寻找指定的字符(character)，返回第一次出现的位置。italics()字符串用斜体字显示lastIndexOf(character,start)从start位置(可以省略)开始向前寻找指定的字符(character)，返回第一次出现的位置。link(URL)创建一个指向所提供URL的HREF标记。t

25、ypeof(对象)获取对象的类型small()用小字体显示字符串split(分隔符)分隔字符串到数组strike()在字符串上加上删除线sub()把字符串显示为下标形式substring(startIndex,endIndex)返回从startIndex(从0开始)直到endIndex右边的所有字符sup()把字符串显示为上标形式escape()将一个字符串转换成URL编码格式unescape()将一个URL编码字符串转换成文本toString()把非字符串值转换为字符串toLowerCase()把字符串所有字符转换为小写形式toUpperCase()把字符串所有字符转换为大写形式protot

26、ype属性是String对象（也是其它内置对象）的属性之一，它的强大之处就在于它能扩展内置对象的定义。当String对象不太适合需要时，就可以利用prototype属性给String对象加上新方法。例4-4 下列脚本程序exa4_4.htm使用String对象的prototype属性添加一个字符串对象的新方法trim，用于去除首尾的空格和字符串中间的多余空格（保留一个空格）。例如字符串“ I am a student ! ”，除前后面均包含有空格之外，在字符之间也包含有多余的空格，现要把它处理成“I am a student !”的形式。function ltrim() var retvalu

27、e = this ; var ch=retvalue.substring(0,1) ;/获取第一个字符 while (ch= ) /检查第一个字符是否为空字符 retvalue=retvalue.substring(1,retvalue.legth) ;/去除第一个空格 ch=retvalue.substring(0,1) ; return retvalue ;function rtrim() var retvalue = this ; ch=retvalue.substring(retvalue.length-1,retvalue.length) ; while (ch= ) /检查最后一个

28、字符是否为空字符 retvalue=retvalue.substring(0,retvalue.length-1) ; /去除最后的空格 ch=retvalue.substring(retvalue.length-1,retvalue.length) ; return retvalue ;function trim() var retvalue = this ; retvalue=retvalue.ltrim() ; retvalue=retvalue.rtrim() ; while (retvalue.indexOf( )!=-1) /检查是否含有两个连续的空格 / 去除两个连续的空格中的一

29、个 retvalue = retvalue.substring(0,retvalue.indexOf( )+retvalue.substring(retvalue.indexOf( )+1,retvalue.length) ; return retvalue ;/由于在调用trim时要先调用ltrim和rtrim，所以它们必须先说明String.prototype.ltrim=ltrim ; /附加到String对象中String.prototype.rtrim=rtrim ; /附加到String对象中String.prototype.trim=trim ; /附加到String对象中var a= I am a student ! ;document.write(*+a.trim()+*) ;程序执行后显示出：“*I am a student !*”。程序利用String对象中的获取字符位置的方法（indexOf），判断出空格的位置，然后再用获取子串的方法（substring）去除多余的空格。