JavaScript之函数

来源：互联网发布：剑网3刘亦菲捏脸数据编辑：程序博客网时间：2024/05/22 12:22

函数实质上就是可以作为一个逻辑单元对待的一组JavaScript代码。使用函数可以使代码更为简洁，提高重用性。在JavaScript中，大约95%的代码都包含在函数中。由此可见，函数在JavaScript中是非常重要的。

一.函数的简单调用：

<!DOCTYPE html><html><head><meta http-equiv="content-type" content="text/html" charset="utf-8" /><title>my js</title><script type="text/javascript">function print(s1,s2,s3){alert(s1+s2+s3);}</script></head><body><script type="text/javascript">print("i ","love ","you");</script></body></html>

显示结果如下：

二.在时间响应中调用函数：

<!DOCTYPE html><html><head><meta http-equiv="content-type" content="text/html" charset="utf-8" /><title>my js</title><script type="text/javascript">function test(){alert("test");}</script></head><body><form action="" method="post"><input type="button" value="提交" onclick="test();"></form></body></html>

点击提交按钮显示如下对话框：（在按钮onclick事件中调用test函数）

三.通过链接调用函数：

在<a>标签中的href标记中使用“javascript:关键字”链接来调用函数，当用户点击该链接时，相关函数将被执行。

<!DOCTYPE html><html><head><meta http-equiv="content-type" content="text/html" charset="utf-8" /><title>my js</title><script type="text/javascript">function test(){alert("forever love");}</script></head><body><a href="javascript:test();">这是一条链接请点击</a></body></html>

执行此代码后，出现一条链接，点击该链接后弹出一条对话框：

四.关于函数的返回值：

<!DOCTYPE html><html><head><meta http-equiv="content-type" content="text/html" charset="utf-8" /><title>my js</title><script type="text/javascript">function setValue(num1,num2,num3){var ave=(num1+num2+num3)/3;return ave;        //返回ave变量}function getValue(num1,num2,num3){document.write("参数分别为："+num1+","+num2+","+num3+".<br>");var value=setValue(num1,num2,num3);            //调用setValue()函数document.write("三个参数的平均值为："+value+".");}</script></head><body><script type="text/javascript">getValue(50,60,70);</script></body></html>

显示结果如下：

五.嵌套函数（在函数内部再定义一个函数）：

<!DOCTYPE html><html><head><meta http-equiv="content-type" content="text/html" charset="utf-8" /><title>my js</title><script type="text/javascript">var out=10;    //定义全局变量function add(num1,num2){       //定义外部函数function inadd(){         //定义内部函数alert("参数的和为："+(num1+num2+out));       //求参数的和}inadd();     //调用内部函数}</script></head><body><script type="text/javascript">add(10,10);     //调用外部函数</script></body></html>

运行结果如下：

六.递归函数：

<!DOCTYPE html><html><head><meta http-equiv="content-type" content="text/html" charset="utf-8" /><title>my js</title><script type="text/javascript">function func(num){     //定义递归函数if(num<=1)return 1;        elsereturn func(num-1)*num;      //调用递归函数}</script></head><body><script type="text/javascript">alert("10！是"+func(10));       //调用函数</script></body></html>

运行结果如下：

0 0