参考资料:《JavaScript从入门到精通》、《PHP、MySQL与JavaScript学习手册》
函数的定义
在JavaScript中,函数是由关键字function,函数名加一组参数以及置于大括号中需要执行的一段代码定义的。
定义函数的基本语法如下:
function functionName(parameter1, parameter2,……)
{
statements;
return expression;
}
参数说明:
functionName:用于指定函数名。在同一个页面中,函数名必须是唯一的,并且区分大小写。
parameter:可选项,用于指定参数列表。一个函数最多可以有255个参数。
statements:函数体。
return expression:可选项,用于返回函数值。
语句的第一行代表:
- 用单词function开始函数定义。
- 紧接着是函数名,必须由字母或下划线开头,后面可以是一串字母、数字、美元符号或下划线。
- 必须有括号。
- 可以有一个或多个参数,参数必须由逗号隔开。
注:函数名对大小写敏感。
例1 定义一个函数
function account(price,number)
{
var sum=price*number;
return sum;
}
函数的调用
函数的简单调用
函数的定义语句通常放在HTML的<head>段中,而函数的调用语句通常放在HTML的<body>段中。
函数的定义及调用语法如下:
<html>
<head>
<script type="text/javascript">
function functionName(parameters) //定义函数
{
some statements;
}
</script>
</head>
<body>
<script type="text/javascript">
functionName(parameters); //调用函数
</script>
</body>
</html>
例2 函数的简单应用
<html>
<head>
<meta http-eqiv="Content-Type" content="text/html;charset=UTF-8">
<title>函数的简单应用</title>
<script type="text/javascript">
function print(statement1,statement2,statement3);
{
alert(statement1+statement2+statement3); //在页面中弹出对话框
}
</script>
</head>
<body>
<script type="text/javascript">
print("第一个JavaScript函数程序 ","作者:","QNKCDZ0"); //调用print()函数
</script>
</body>
</html>
输出:
第一个JavaScript函数程序 作者:QNKCDZ0
在事件响应中调用函数
当用户单机某个按钮或选中某个复选框时都将触发事件,通过编写程序对事件做出反应的行为称为响应事件。在JavaScript语言中,将函数与事件相关联就完成了响应事件的过程。
例3 当用户单击一个按钮时执行相应的函数
<head>
<script language="javascript">
function test()
{
alert("test");
}
</script>
</head>
<body>
<form action="" method="post" name="form1">
<input type="button" value="提交" onclick="test();">
</form>
</body>
通过链接调用函数
函数可以在链接中被调用。
在<a>标签的href标记中使用“javascript:关键字”链接来调用函数。当用户单击该链接时相关函数将被执行。
例4 通过链接调用函数
<html>
<head>
<script language="javascript">
function test()
{
alert("test");
}
</script>
</head>
<body>
<a href="javascript:test()";>test</a>
</body>
</html>
使用函数的返回值
可以在函数中添加return语句,将需要返回的值返回。
例5 函数返回值的简单使用
<html>
<head>
<meta http-eqiv="Content-Type" content="text/html;charset=UTF-8">
<title>函数的返回值</title>
<script type="text/javascript">
function setValue(num1,num2,num3)
{
var avg=(num1+num2+num3)/3;
return avg;
}
function getValue(num1,num2,num3)
{
document.write("参数分别为:"+num1+"、"+num2+"、"+num3+"。");
var value=setValue(num1,num2,num3);
document.write("取参数平均值,运行结果为:"+value);
}
</script>
</head>
<body>
<script type="text/javascript">
getValue(60,59,60);
</script>
</body>
</html>
输出:
参数分别为:60、59、60。取参数平均值,运行结果为:59.666666666666664
嵌套函数
所谓嵌套函数即在函数内部再定义一个函数。
嵌套函数的语法如下:
<script type="text/javascript">
var outter=10;
function functionName(parameters1,parameters2)
{
function InnerFunction()
{
somestatements;
}
}
</script>
参数说明:
- functionName:外部函数名称。
- InnerFunction:嵌套函数名称。
注意:使用嵌套函数可能会使代码的可读性降低。
递归函数
递归函数就是函数在自身的函数体内调用自身。
递归函数一般只有在特定情况下使用,例如求阶乘问题。
递归函数的语法如下:
var outter=10;
function functionName(parameters1)
{
functionName(parameters2);
}
例6 使用递归函数求10!
<html>
<head>
<meta http-eqiv="Content-Type" content="text/html;charset=UTF-8">
<title>递归函数的应用</title>
<script type="text/javascript">
function f(num)
{
if(num<=1)
{
return 1;
}
else
{
return f(num-1)*num;
}
}
</script>
</head>
<body>
<script type="text/javascript">
alert("10!的结果为:"+f(10));
</script>
</body>
</html>
JavaScript中的内置函数
在使用JavaScript时,可以使用JavaScript的内置函数,这些函数是由JavaScript语言提供的。
parseInt()函数
该函数主要将首位为数字的字符串转换为数字,如果字符串不是以数字开头,那么返回NaN。
语法:
parseInt(StringNum,n);
参数说明:
- StringNum:需要转换的字符串
- n:可选项,提供在2~36之间的数字表示所保存数字的进制数。
parseFloat()函数
该函数主要将首位为数字的字符串转换为浮点型数字,如果字符串不是以数字开头,那么返回NaN。
语法:
parseFloat(StringNum);
isNaN()函数
该函数主要用于检查某个值是否为NaN。如果是,返回true,否则返回false。
语法:
isNaN(Num);
isFinite()函数
该函数主要用于检验某个表达式是否为无穷大。如果是,返回true,否则返回false。
语法:
isFinite(Num);
encodeURI()函数
该函数主要用于返回一个URI字符串编码后的结果。
语法:
encodeURI(url);
decodeURI()函数
该函数主要用于将已编码为URI的字符串解码为最初的字符串并返回。
语法:
decodeURI(url);
Function()构造函数与函数直接量
还可以使用Function()构造函数和函数直接量定义来定义函数。