javascript自定义函数教程Word下载.docx
- 文档编号:21325422
- 上传时间:2023-01-29
- 格式:DOCX
- 页数:24
- 大小:82.44KB
javascript自定义函数教程Word下载.docx
《javascript自定义函数教程Word下载.docx》由会员分享,可在线阅读,更多相关《javascript自定义函数教程Word下载.docx(24页珍藏版)》请在冰豆网上搜索。
比如,javascript自带了大量处理字符串的函数,但内建函数并没有定义处理清除字符串两端空格的函数,这时就需要根据javascript已有的内建函数和javascript语法创建这样功能更加细化的函数,相比起来,处理字符串更加专业)
本书主讲javascript自定义函数。
函数的基本组成由函数定义和函数调用两部分组成,应首先定义函数,然后再进行调用。
更多资料请参考飘香书院
(一)根据声明的方式(形式)分为
■显式函数,即在声明函数时明确定义了函数名。
形式
functionfunctionName([parameters]){//代码块};
■匿名函数(函数直接量),即在声明函数时没有定义函数名,而是把函数赋值给一个变量。
形式:
varfunctionName=function([parameters]){//代码块};
■作为对象的的构造函数,即Function对象的构造函数Function()。
VarfunctionName=newFunction([arg1,[arg2..argN]],body)
■怪异函数(多头函数)。
varfunctionName1=functionfunctionName2([parameters]){//代码块};
■一次性对象的函数
先看一下一次性对象(prototype采用的对象开发结构):
varvariable=newObject(){
variable.variA="
Va1"
;
variable.variB="
Va2"
variable.method=function(){returnthis.variA+variB;
}}
我们也可以用旧函数来创建一个类似的对象,然后将其赋值给一个变量,并将其作为一次对象来使用
varvariable=newfunction(){this.variA="
this.variB="
this.method=function(){returnvariA+variB;
}
(二)根据函数的作用域分为
■全局函数
■局部函数
(三)根据函数有无返回值分为
■有返回值函数(函数体内有return关键字并在关键字后有返回的表达式)
■无返回函数(函数体内没有有return关键字或有关键字但在关键字后没有有返回的表达式)
函数的定义应使用关键字function,语法规则如下:
functionfunctionName([parameters])
{[varvariable;
]
Statements;
[return表达式;
]}
函数各部分解析如下:
■function。
关键字,表示定义新函数的开始,无论何时调用该函数,函数的大括号中所定义的代码都将被执行。
Function不能写成Function。
Function表示一个对象。
■functionName。
为函数名,函数名可由开发者自行定义,函数的命名原则与变量命名的原则相同,但尽量不要惊函数和变量取相同一个名字。
如因实际情况需要将函数和变量定义相近的名字,也尽量给函数加上可以清楚辨别的字符(如前缀func等)以示区别。
另一需要注意的是函数的命名尽量与要实现的功能相关,可直接从函数的名字就知道函数的功能。
■parameters。
为函数的参数。
可选项。
在调用目标函数时,需要将实际数据传递给参数列表以完成函数特定的功能。
参数列表中可定义一个或多个参数,个参数之间加“,”分隔开来,当然参数列表也可为空,但函数名后这对圆括号不能省略。
■{}对,封装功能代码块,表示函数开始结束的范围。
■variable;
。
为函数体内的局部变量。
■statements。
为函数执行语句,实现了函数的功能。
■return。
关键字指定函数的返回值。
调用return关键字返回函数值后将停止函数后面的代码执行并退出函数,因而,一般将return语句放在函数体的最后返回函数值,或者在函数体内某个判断时需要退出函数调用该语句。
函数定义过程结束后,可在文档中任意位置调用该函数。
调用函数时只需要在函数名后加上小括号即可。
若目标函数需要引入参数,则需要在小括号内添加传递参数。
如果函数有返回值,可将最终结果赋值给一个自定义的变量并用关键字return返回。
更多资料请参考飘香书院
2.2.1.、函数调用注意事项;
(1)和定义函数一样,在调用函数时,函数名后面必须紧跟着圆括号,即使没有传入的参数。
圆括号有两个作用:
◆一告知程序需要执行该函数;
◆二提供传送给函数的数据,也就是参数(parameters)。
不是每个函数都需要传递参数,但在调用函数时必须使用圆括号。
不适用圆括号调用函数导致返回函数的文本,而不是期望函数返回的任何内容。
实际上没有圆括号函数并没有被执行。
(2)调用函数时传递的参数个数必须与定义函数时定义的参数个数相同(例外,如果函数定义时并没有定义要传递的参数,那么在调用时,可传递多个参数,这需要用到arguments数组。
(3)如果函数有返回值,可将最终结果赋值给一个变量。
如functionsum(x,y){returnx+y}
Varresult=sum(1,2)
得到result的结果为3.
(4)可将函数作为一个参数传递给另外一个函数,但在参数列表中函数不能有“()”圆括号对,因为圆括号第一个作用就是执行该函数,而我们需要将这个函数作为参数变量传递到另一个函数体内,就不能立即执行该函数。
在另一个函数执行该函数只需要在传如的参数变量名后加上圆括号“()”对即可执行该函数。
如有参数须在圆括号中加入相应数量的参数。
如functionsum(x,y){returnx+y}//定义作为参数传入的函数
functionsumDemo(func){varx=1;
vary=2;
returnfunc(x,y);
varresult=sumDemo(sum)//调用sumDemo函数
得到结果result为3
2.2.2.、函数递归调用
函数的递归调用即函数在定义时调用自身,
例:
functionTest(){
varresult;
msg+="
调用语句:
\n"
msg+="
result=sum(6);
\n"
调用步骤:
result=sum(6);
计算结果:
result="
+result+"
alert(msg);
}
//计算当前步骤加和值
functionsum(m){
if(m==0)return0;
else{msg+="
语句:
result="
+m+"
+sum("
+(m-1)+"
);
result=m+sum(m-1);
}
returnresult;
<
inputtype=buttonvalue="
测试"
onclick="
Test()"
>
/form>
/center>
/body>
/html>
程序运行后,在原始页面单击“测试”按钮,弹出警告框如图2.35所示。
图函数递归调用函数递归调用能使代码显得紧凑、简练,但也存在执行效率并低、容易出错、资源耗费
较多等问题,推荐在递归调用次数较少的情况下使用该方法,其余情况尽量使用其余方法来代替。
一旦定义函数时定义了参数的名称,则在函数每次调用时参数就将被替换成可用变量,在函数内就可以使用这些传递给函数的数据了。
2.3.1、参数传递的形式
Javascript函数参数传递的形式大致可有如下几种
(1)基本数据类型的直接传递。
字符串参数传递
例1:
alert(”我是中国人”)
数值类型参数传递
例2:
sum(4,3)
从上面可看出,传递字符串时必须在字符串两端加上“”双引号,表示字符串的开始和结束,更重要的是与javascript其他的书写语法一样,双引号必须是再英文输入模式下的英文输入。
(2)变量间接传递参数。
在调用函数时并不是直接传递一个实际数据类型,而是传递一个中转变量。
例3:
functionsum(x,y){returnx+y}
vart=1,m=2;
Varresult=sum(t,m);
得到结果result为3
(3)arguments数组获得参数。
除了通过为参数赋值的方式向函数传送值之外,函数还可以通过自动生成的arguments数组来获得相应的值。
Arguments对象的属性有length和callee。
length属性。
进行函数调用时,除了指定的参数外,还创建一个隐含的对象——arguments。
arguments是一个类似数组但不是数组的对象,说它类似是因为它具有数组一样的访问性质,可以用arguments[index]这样的语法取值,拥有数组长度属性length。
arguments对象存储的是实际传递给函数的参数,而不局限于函数声明所定义的参数列表,例如:
functionfunc(a,b){alert(a);
alert(b);
for(vari=0;
i<
arguments.length;
i++){alert(arguments[i]);
}
func(1,2,3);
代码运行时会依次显示:
1,2,1,2,3。
虽然此例与前面讲到的函数调用时传递的参数个数必须与声明时参数个数相同有悖,但这样做不失为一个好习惯。
arguments数组获得参数的作用在于,即使函数在声明时没有定义任何参数,在调用该函数时也将传递一个或多个参数,这些位于arguments数组里面的参数仍然可用。
这对于编写可以接受任意个参数的函数将十分有用。
functionsum(){varx=arguments[0]//获得传入的第一个参数
Vary=arguments[1]//获得传入的第二个参数
returnx+y
Varresult=sum(1,2)得到结果result为3.
callee属性。
arguments对象的另一个属性是callee,它表示对函数对象本身的引用,这有利于实现无名函数的递归或者保证函数的封装性,例如使用递归来计算1到n的自然数之和:
varsum=function(n){
if(1==n)
return1;
else
returnn+sum(n-1);
alert(sum(100));
其中函数内部包含了对sum自身的调用,然而对于JavaScript来说,函数名仅仅是一个变量名,在函数内部调用sum即相当于调用一个全局变量,不能很好的体现出是调用自身,所以使用arguments.callee属性会是一个较好的办法:
returnn+arguments.callee(n-1);
callee属性并不是arguments不同于数组对象的惟一特征,下面的代码说明了arguments不是由Array类型创建:
Array.prototype.p1=1;
alert(newArray().p1);
functionfunc(){
alert(arguments.p1);
func();
运行代码可以发现,第一个alert语句显示为1,即表示数组对象拥有属性p1,而func调用则显示为“undefined”,即p1不是arguments的属性,由此可见,arguments并不是一个数组对象。
2.3.2、传入参数检测
由于javascript是弱类型语言,使用变量时并不检测其数据类型,导致一个潜在的威胁,即开发者在调用函数时,传递给函数的参数量或数据类型不满足要求而导致错误的出现。
在函数调用时,应仔细检查传递给目标函数的参数变量的数量和数据类型。
●参数个数检查应用函数自动生成的arguments数组的length属性。
●参数的类型检查应用javascript的typeof运算符。
functionmuti(x,y){
if(muti..arguments.length==2){return(x*y);
//检查输入参数的数量
if(typeof(x)!
=”number”||typeof(y)!
=”number”)returnerrorNum//检测数据类型
else
return(x*y);
Return;
解析:
上面这个函数既检查了参数的数量,又检查了参数的数据类型,避免了我们在调用时传递了错误的参数变量或数据类型。
其实,即使没有检查参数的数量,在调用函数传递了正确的参数个数(与定义时的参数个数相同)也不会出现什么(除非传递的数据类型错误,如在传递一个字符串时没有加双引号“”)。
如果传送的参数与定义时的参数个数不一致,则在调用函数时会出现运行时错误。
return关键字在是一个应用在函数体内的关键字,它有两个作用:
一返回函数值;
二结束函数。
2.4.1、函数返回值(函数的数据输出)
函数可以向调用它但语句返回一个值。
使用函数返回值的最佳方式就是通过函数调用来为变量赋值,这样该变量的值就是函数的返回值。
让函数返回一个值,就需要使用关键字return,在return后面跟上该函数需要返回的表达式或值。
例:
functionsum(x,y){returnx*y;
alert(“sum=”+(x+y));
varresult=sum(1,2)
return语句通常是函数中的最后一个行为,因为函数返回值之后就不能再执行任何其他操作。
所以在上面的sum(x,y)中,return执行之后,后面的alert()语句将不再被执行,而是直接跳出函数。
2.4.2、终止函数的执行
在上面讲过,return可用于终止函数的执行。
return语句的这种终止函数运行的能力在和条件语句组合时将变得十分有用。
这样就可以实现仅当条件满足时,函数中的其余部分才会被执行。
形式为直接调用return语句,后面不需要跟任何表达式或值。
if(muti..arguments.length!
=2){
return;
//检查输入参数的数量,如果数量不等于2就终止函数的执行跳出函数体
}else{
if(typeof(x)!
Javascript是一个弱类型的语言,声明变量时并不需要明确的使用关键字var来声明一个变量,但我们应该在声明变量时避免省略var关键字,这将有效避免函数中可能出现的变量冲突。
函数体中根据是否有var关键字可分为全局变量和局部变量,局部变量又可分为var局部变量和参数变量。
(1)全局变量。
函数体内的变量不是在函数中声明的,或函数体内的变量并没有用var关键字,因此这些变量的作用域是全局的。
具有全局作用域的的变量可以被当前运行页面中的所有其他javascript代码使用。
这听起来并不是件糟糕的事,而且这种情况通常也不会出现问题,直到在函数中使用了一个与全局变量相同的变量名。
functioncount(){
stock=5;
sales3=3
returnstock-sales;
stock=0;
wiis=count()
这段代码运行之后变量stock值是多少?
读者可能会认为它仍然是0,因为在调用count之前已经将该变量的值赋值为0了。
然而函数count中也使用了名为stock的变量,而且因为在函数中并未使用关键字var来声明该变量,因此javascript将会在整个代码范围中查找该变量是否已经存在。
在本程序中,变量stock已经存在,因此javascript将吧数字5赋值给全局变量。
你可能已经发现这段代码的问题。
几乎所有的地方都没有使用关键字var。
即使函数外的代码显式地把stock变量初始化为0,通过调用count()函数来修改了这个变量。
可以看出,由于没有引入神奇的作用域问题而太过混论,所以应尽量编写上面类似的代码以避免出现变量的冲突混论。
解决这个最好的办法就是在函数内和函数外使用不同的名字并且明确的使用var关键字声明变量。
(2)var局部变量。
var局部变量就是在函数体内明确使用var关键字声明的变量。
局部变量仅在创建它的函数范围内有效,局部变量的优先级高于全局变量,也就是如果函数内的局部变量和全局变量同名,则函数总是使用局部变量而不是全局变量。
functioncount(){
varstock=5;
varsales=3;
Varstock=0;
varwis=count()
在函数count外声明的变量stock对函数内声明的变量stock毫无影响,因此函数count可以独立地处理它的内部的变量;
同样函数体内声明的stock变量也不影响函数外声明的同名全局变量stock,调用函数count后,函数外声明的stock全局变量值仍然为0;
(3)参数变量。
参数变量也是局部变量,它是声明函数时定义的参数。
functionsum(x,y){……..}
x,y为函数sum(x,y)内的局部变量,仅在该函数中其作用。
注意:
除非需要定义一个在整个程序中都必须使用的变量,否则定义变量时都要使用关键字var。
严格地说,不论是使用关键字var定义的变量,还是用直接为声明的变量赋值的方法创建的变量,在函数外定义的变量都具有全局作用域。
然而,应该养成用var声明变量的好习惯,这也被认为是最佳实践。
定义
又称函数直接量,是在声明函数时并没有指定函数名,而是赋值给一个变量(把函数本身绑定到一个变量)。
函数不是必须像一般函数那样正式地描述。
可以如下的定义形式:
varnum=function(first,second){returnfirst/second;
定义后就可调用该函数了。
调用
一般函数的调用是通过函数名来传递参数进行调用,但匿名函数没有函数名,那该如何调用呢?
很简单,调用该变量名加上一对“()”即可,如果匿名函数有参数,可在圆括号中传入相同个参数,与一般函数传递的参数无异。
例1:
定义一个返回指定id元素的对象,并调用该函数。
Var$=function(id){returndocument.getElementById(id);
}//定义匿名函数并赋值给变量$
Element=$(“body”)//得到body对象并赋值给Element变量
用途
匿名函数的一般用途是作为对象的方法引用。
定义一个对象,并为该对象添加一个方法
VarNum={}//定义一个空对象Num
Num.method=function(){alert(“好好是”);
}//为该对象添加一个方法,方法名为method。
Num。
method()//调用method方法,将执行匿名函数体内的alert()语句。
例2:
为事件句柄赋值执行函数语句。
Body.onClick=function()function(){alert(“好好是”);
onClick是body对象的事件方法,通过给该方法赋值,当单击body对象时弹出消息框。
其实,从上面可知,不管是为对象添加方法,还是为对象的方法赋值,都是被看做为变量赋值。
为什么定义了函数的一般形式还要有函数的匿名形式呢?
这就是上面提到的匿名函数可以直接赋值给对象的方法,使得对象的组织形式浅显易懂。
比较一般函数和匿名函数:
仔细对比这两种格式,他们的作用有一点细微的区别。
一般函数定义可以被文件中的任何代码使用,即使在函数定义之前也可调用该函数;
匿名函数定义仅能在该函数赋值语句之后才能调用。
但如果程序代码组织良好,这种区别也就无所谓了。
第4章、对象的的构造函数
Javascript脚本语言中所有的数据类型、数组等都可作为对象对待,函数也不例外。
可以使用new操作符和Function对象的构造函数Function()来生成指定规则的函数
Javascript核心对象Fuction为构造函数的对象,由于开发者一般直接定义函数而不是通过使用Function对象穿件实例的方式来生成函数,对于实际编程而言,Function对象很少涉及到,但
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- javascript 自定义 函数 教程