什么是函数?
函数是一组可重复使用的代码块,在 JavaScript 中,函数由事件驱动或者被其他代码调用。
函数是 JavaScript 语言的核心之一,其基本语法如下:
function functionName(arg0, arg1, ...) {
statements
}
语法解读
使用 function 关键字定义一个函数
function 关键字空格之后紧跟函数名
函数名字后面是一对小括弧,arg0, arg1 表示函数的参数,参数之间以 , 号分隔,参数个数可以为 0-25 个(0即表示无参数)。在没有参数时,() 括号不可省略,超过25个的参数,将被JavaScript忽略
{} 是函数体,里面是该函数要实现的功能语句
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script type="text/javascript"> function hello(name){ document.write(name + ",你好!"); } </script> </head> <body> <input type="button" onclick="hello('小明')" value="确定" /> </body> </html>
JavaScript 函数命名
通常,我们推荐函数的名字使用小驼峰命名法,并以函数名能大致描述该函数功能或特性为宜。小驼峰法是指,首字符小写,后面其他单词的首字母大写,下面是一些函数命名例子:
function changeName(){
...
}
function getAgeByInput(){
...
}
也有不少人使用下划线来分割函数名中的单词,如 change_name,这也是可以的,实际执行可依照具体项目规范。
特别地,函数前加 _ 符号(如 _getName),一般约定俗成表示类(对象)的私有方法。
JavaScript 函数内的变量
如果一个变量在函数体内被声明,则只能在该函数中访问该变量。这样,您可以在不同的函数内使用名称相同的变量。
如果在函数之外声明了一个变量,则 Web 页面上的所有函数都可以访问该变量。
JavaScript 函数参数
JavaScript 函数允许没有参数(但包含参数的小括号不能省略),也可以向函数传递参数供函数使用。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script type="text/javascript"> function hello(name,age){ document.write("我叫" + name + ",今年" + age + "岁!"); } </script> </head> <body> <input type="button" onclick="hello('小明',18)" value="确定" /> </body> </html>
运行该例子,点击 确定 按钮,输出:
我叫小明,今年18岁!
如上例所示,传入的值是字符串时,需要加上引号;传入的值是数字,不需要加引号。
JavaScript 函数参数错误
JavaScript 函数参数并没有严格要求哪些参数是必选参数,哪些参数是可选参数,因此传入的参数个数是允许不等于定义函数时参数的个数的。
如果在函数中使用了未定义的参数,则会提示语法错误(参数未定义),JavaScript 代码不会正常运行。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script type="text/javascript"> function hello(name,age){ document.write("我叫" + name + ",今年" + age + "岁!"); } </script> </head> <body> <input type="button" onclick="hello('小明')" value="确定" /> </body> </html>
运行该例子,点击 确定 按钮,输出:
我叫小明,今年undefined岁!
JavaScript 函数 return
JavaScript 函数的 return 语句用来规定从函数返回的值。当一个函数运行后,要得到一个运行结果,就需要使用 return 语句来返回该结果。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script type="text/javascript"> function sum(x,y){ return x+y; } result = sum(2,3); document.write( result ); </script> </head> <body> </body> </html>
运行该例子输出:5
无返回值的 return 语句
如果函数无返回值,那么可以调用没有参数的 return 运算符,随时退出函数:
<script type="text/javascript">
function sum(x,y){
if( x<y ){
return;
}else{
return x-y;
}
}
</script>
局部 JavaScript 变量
在 JavaScript 函数内部声明的变量(使用 var)是局部变量,所以只能在函数内部访问它。(该变量的作用域是局部的)。
您可以在不同的函数中使用名称相同的局部变量,因为只有声明过该变量的函数才能识别出该变量。
只要函数运行完毕,本地变量就会被删除。
全局 JavaScript 变量
在函数外声明的变量是全局变量,网页上的所有脚本和函数都能访问它。
JavaScript 变量的生存期
JavaScript 变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除。
向未声明的 JavaScript 变量分配值
如果您把值赋给尚未声明的变量,该变量将被自动作为全局变量声明。
这条语句:
carname="Volvo";
将声明一个全局变量 carname,即使它在函数内执行。