《JavaScript程序设计课件第4章.ppt》由会员分享,可在线阅读,更多相关《JavaScript程序设计课件第4章.ppt(33页珍藏版)》请在三一办公上搜索。
1、第4章函数,在进行复杂的程序设计时,通常是根据所要实现的功能将程序划分为一些相对独立的部分,每个部分编写成一个函数,从而使任务单一、结构清晰,程序易于阅读、理解和维护。JavaScript中的函数将一些共享的程序代码独立出来,能够传递参数并返回执行的结果。在程序中可以通过使用函数名来调用函数。在JavaScript中有两种函数,即JavaScript内置的系统函数和用户自定义的函数。,函数是完成特定任务的语句段。当需要重复执行某种任务时,就应把相应的语句组织成函数,这样,在JavaScript程序的任何位置都可以通过引用函数名来执行函数。程序员可以在程序中建立多个函数,这有利于组织应用程序的结
2、构,使程序代码的维护与修改更容易。,第4章函数,4.1函 数 概 述,4.1.1定义函数 在JavaScript中使用函数前,需要先对其进行定义。函数的定义要使用function关键字,其语法格式如下所示(方括号“”中的内容为可选项):function 函数名(参数列表)语句return语句,第4章函数,4.1函 数 概 述,在定义函数时,需要注意以下事项:(1)函数名必须唯一,且区分大小写。(2)参数可以是常量、变量和表达式。(3)参数列表中有多个参数时,参数间以逗号“,”隔开。(4)若函数需要返回值,则使用return语句。(5)定义函数并不会执行组成函数的语句,只有调用函数时,函数才会执
3、行。(6)如果省略了return语句中的表达式,或函数中没有return语句,函数就会返回一个undefined值。,第4章函数,4.1函 数 概 述,在函数的定义中可以看到函数名后有一个参数列表,其中可以有一个或者几个参数。那么怎样确定参数的个数呢?在JavaScript中,可以通过使用arguments.length属性来检查参数的个数。例如:function function_Name(exp1,exp2,exp3,exp4)使用arguments.length属性检查参数的个数 number=function_Name.arguments.length;if(number1)docum
4、ent.write(exp2);if(number2)document.write(exp3);if(number3)document.write(exp4);参看例4-1,第4章函数,4.1函 数 概 述,4.1.2调用函数 通常可以在文档的头部定义函数,以便在装载HTML文档时首先载入函数。如果函数没有返回值或者调用程序不关心函数的返回值,可以使用下面的语法格式调用已经定义的函数:函数名(传递给函数的参数1,传递给函数的参数2,传递给函数的参数n);参看例4-1、例4-2、例4-3.,第4章函数,4.1函 数 概 述,变量是程序中一个已经命名的存储单元,主要用于为数据操作提供存放信息的容器
5、。在程序中,变量存储的数值是可以变化的。根据变量的作用域,可以将变量分为全局变量和局部变量两种。,第4章函数,4.2全局变量和局部变量,4.2.1全局变量 在函数之外声明的变量叫做全局变量。例如:var x=5;定义全局变量xfunction myFunction()document.write(在函数体外:);显示提示信息document.write(x=+x+);输出此时x的值,第4章函数,4.2全局变量和局部变量,4.2.2局部变量 在函数内声明的变量叫做局部变量。例如:function myFunction()document.write(在函数体内:);显示提示信息x=7;定义局部变
6、量xdocument.write(x=+x+);输出此时x的值,第4章函数,4.2全局变量和局部变量,4.2.3变量的作用域 变量的一个重要属性就是变量的作用域。全局变量的作用域是此变量定义后的所有语句,包括其后定义的函数和中的代码。局部变量作用于函数内部,只对其所在的函数体有效,在此函数后的其他函数中定义的同名变量与此变量毫无关系,且以最后一个定义的变量的值为准。在下面的例子中建立了两个函数,以说明全局变量和局部变量的作用域。参看例4-5.,第4章函数,4.2全局变量和局部变量,4.2.4使用局部变量避免冲突 如果函数中定义了与全局变量同名的局部变量,则在此函数中位于此变量定义之后的脚本代码
7、使用的是局部变量,而不是全局变量。此时,全局变量被局部变量覆盖,不再起作用。因此,在定义变量的时候,为了避免发生不必要的冲突,提倡使用局部变量。下面是一个使用局部变量避免冲突的示例。参看例4-6.,第4章函数,4.2全局变量和局部变量,在函数的定义中,函数名后的参数表中可以有一个或多个参数,也可以没有参数,这需要根据实际应用确定。,第4章函数,4.3函数参数的使用,4.3.1给函数添加参数 在4.1节中已介绍了简单函数的定义及调用形式,这里介绍如何在函数中使用参数。定义函数时指定的参数称为形式参数,简称形参;调用函数时实际传递的值称为实际参数,简称实参。定义带参数的函数的语法格式如下:func
8、tion函数名(形参1,形参2,形参n)函数体调用带参数的函数的语法格式如下:函数名(实参1,实参2,实参n)下面的例子定义了一个带有参数的Show函数,它把参数text中的字符串显示在Web页面上。参看例4-7.,第4章函数,4.3函数参数的使用,4.3.2使用多个参数 如果函数带有多个参数,调用函数时实参按照形参排列的顺序依次传递给函数中定义的相应的形参。参看例4-8.,第4章函数,4.3函数参数的使用,4.3.3使用参数数组 函数中的arguments参数数组包含了传递给当前函数的每个参数,如argumentsi或functionName.argumentsi,其中,i是一个序列数,其值
9、从零开始计数,因此,传递给函数的第一个参数应是arguments0。通过设置arguments的属性,函数可以很好地处理数量可变的参数。当不知道将有多少个参数传递给函数时,arguments参数数组可以用arguments.length属性确定实际传递给函数的参数数量。参看例4-9.,第4章函数,4.3函数参数的使用,在JavaScript中,有的函数有返回值,有的没有返回值(返回值是空)。本节对函数返回值的相关知识进行简单介绍。4.4.1给函数添加返回值 在JavaScript中,可以使用return语句返回函数的值,其语法格式如下:参看例4-10.return 表达式;4.4.2区分函数和
10、过程 在JavaScript中,把只返回undefined值的函数称为过程。函数和过程的区别是过程调用单独使用一条语句,而函数调用则可以出现在表达式中。参看例4-11.,第4章函数,4.4使用函数返回值,在其他语言(如C语言)中,可以定义指向函数的指针,也就是可以定义一个指针变量来指向某个函数,以后就可以用这个指针变量来调用其指向的函数。JavaScript也提供了类似的技术,称为创建动态函数。4.5.1使用Function对象创建动态函数 创建一个动态函数需要使用Function对象,其语法格式为:var 变量名=new Function(参数列表);其中,参数列表中的所有参数都必须是字符串
11、型,最后一个参数是这个动态函数的功能程序代码。参看例4-12.,第4章函数,4.5创建动态函数,4.5.2动态函数与函数直接量 动态函数和函数直接量之间存在以下差别:首先,动态函数允许在运行时动态创建和执行JavaScript代码;而函数直接量是程序结构的一个静态部分,就像函数语句一样。其次,每次调用动态函数时都会解析函数体,并且创建一个新的函数对象,因此,如果对构造函数的调用出现在一个循环或一个经常被调用的函数中,这种方法的效率将非常低;函数直接量不论出现在循环中还是出现在嵌套函数中,都不会在每次调用时被重新解析,也不会每次都创建一个新的函数对象,从而提高了程序的执行效率。最后,动态函数总是
12、被当作顶级函数来编译。,第4章函数,4.5创建动态函数,在JavaScript中,不仅可以使用自定义函数,还可以使用JavaScript提供的系统函数(也称为内部方法)来实现某些功能。本节对JavaScript中的常用系统函数进行简单介绍。,第4章函数,4.6JavaScript的系统函数,4.6.1URI编码处理函数 URL(Uniform Resource Locator,统一资源定位符)是最常用的一种URI(Universal Resource Identifier,通用资源标识符)。URI比URL表示的范围更大,不仅限于描述Internet资源的地址,还包括数字对象标识符和国际标准书号
13、等标识名称。JavaScript主要包括两个编码函数:encodeURI和decodeURI。,第4章函数,4.6JavaScript的系统函数,1.encodeURI函数 encodeURI函数返回对某个URI字符串编码后的结果。其语法格式如下:encodeURI(URIString);其中,URIString是必选项,代表一个要编码的URI字符串。参看例4-13.2.decodeURI函数 与encodeURI函数相反,decodeURI函数将一个已编码的URI字符串解码成原始的字符串并返回。其语法格式如下:decodeURI(URIstring);其中,URIstring是必须有的,表示
14、一个要解码的URI字符串。参看例4-14.,第4章函数,4.6JavaScript的系统函数,4.6.2数值处理函数 JavaScript中的数值处理函数主要有parseInt、parseFloat和isNaN。1.parseInt 函数 parseInt函数将一个字符串按照指定的进制转换成一个整数,其语法格式为:parseInt(numstring,radix),第4章函数,4.6JavaScript的系统函数,其中,第一个参数是要进行转换的字符串;第二个参数为可选项,是介于236之间的一个数值,用于指定字符串转换所用的进制类型。如果未指定第二个参数,则前缀为“0 x”的字符串被视为十六进制
15、数,前缀为“0”的字符串被视为八进制数,所有其他字符串都被视为十进制数。如果要转换的字符串中包含无法转换成数字的字符,那么parseInt函数只对字符串中的数字部分进行转换,如parseInt(“12abc”)的返回结果为12。如果parseInt函数完全无法将一个字符串中的第一个字符转换成数字,将返回NaN。NaN需要使用isNaN方法才能检测出来。参看例4-15.,第4章函数,4.6JavaScript的系统函数,2.parseFloat函数 parseFloat函数用于将一个字符串转换成对应的浮点数。其语法格式如下:参看例4-16.parseFloat(string);其中,string
16、是必须有的,表示要解析的字符串。3.isNaN函数 isNaN函数可以用于检测parseInt和parseFloat函数的返回值是否为NaN,如果是,则返回值为true,否则返回false。其语法格式如下:参看例4-17.isNaN(x);其中,x是必须有的,表示要检测的值。,第4章函数,4.6JavaScript的系统函数,4.6.3字符串编码处理函数 字符串编码处理函数在JavaScript传递参数的过程中起到了很重要的作用,使用字符串编码处理函数,可以有效防止数据泄露。这里主要介绍3个JavaScript字符串编码处理函数:escape、unescape和eval。,第4章函数,4.6J
17、avaScript的系统函数,1.escape函数 escape函数返回对一个字符串编码后的结果字符串,其中,所有空格、标点、重音符号以及任何其他非ASCII码字符都用%xx(xx等于该字符对应的Unicode编码的十六进制数)格式的编码替换,例如,空格返回为%20。值大于255的字符以%uxxxx格式存储。escape函数的语法格式如下:escape(string);其中,string是要被转义或编码的字符串。需要说明的是,对URI的编码不要使用escape函数,而应使用encodeURI函数。参看例4-18.,第4章函数,4.6JavaScript的系统函数,2.unescape函数 un
18、escape函数将一个用escape函数编码的字符串解码成原始字符串并返回。其语法格式如下:unescape(string);其中,string是必须有的,表示要解码或反转义的字符串。参看例4-19.,第4章函数,4.6JavaScript的系统函数,3.eval 函数eval函数将某个字符串参数作为一个JavaScript表达式执行。如果想在运行时修改变量的名称,则可以使用eval函数实现此功能。其语法格式如下:eval(codeString);其中,codeString是包含JavaScript语句的字符串,例如:for(var i=0;in;i+)eval(var a+i+=+i);,第
19、4章函数,4.6JavaScript的系统函数,上面这段代码定义了n个变量,变量名分别为a0,a1,an,相当于在JavaScript中直接编写如下代码:var a0=0;var a1=1;var an=n;随着n在运行时的不同取值,可以在程序中定义数量和名称变化的变量。可见,使用eval函数可以在程序中动态产生表达式。,第4章函数,4.6JavaScript的系统函数,直接或间接调用自身的函数称为递归函数。递归是一种重要的编程技术,此方法用于使一个函数从其内部调用自身。计算阶乘就是典型的递归函数应用。如果要定义一个计算某个数的阶乘的函数,可以对其功能进行如下描述:(1)如果这个数小于零,则拒
20、绝接受。(2)如果这个数不是整数,则将其向下舍入为相邻的整数。(3)如果这个数为零,则其阶乘为1。(4)如果这个数大于零,则将其与相邻较小的数的阶乘相乘。递归函数来自于对问题的递归解决方法。例如,阶乘的递归定义为:对于n!,如果n=1,那么n!=1;否则n!=n(n-1)!。下面举例说明递归函数的应用。参看例4-20.,第4章函数,4.7递 归 函 数,在递归函数中有以下两个必不可少的要素:(1)是否继续递归调用的条件。(2)递归调用语句。参看例4-21.,第4章函数,4.7递 归 函 数,本章介绍了函数的定义、调用及如何使用函数的参数,并介绍了全局变量和局部变量的概念,以及JavaScript系统函数的使用方法。本章的重点是理解函数的定义与调用,掌握JavaScript的系统函数的语法格式以及如何在实践中应用。,第4章函数,本 章 小 结,本章结束,谢谢大家!,