JavaScript
二、函数
函数是一个复杂数据类型,承载一段代码,在你需要的时候执行
JS中的函数(方法):就是把代码块进行了封装,声明的这个函数或者方法,它里面封装的代码块就是为了实现某个功能。
2.1 声明式函数(有函数名的函数)
2.1.1 声明
1.根据函数是否有参数来划分
- 无参函数(方法)
function 函数名(){
函数体;
}
- 有参函数(方法):
function 函数名(参数1,参数2…){
函数体;
}
2.根据函数是否有返回值来划分 return
- 无返回值函数:
function 函数名([参数1,参数2…]){
函数体;
}
- 有返回值函数:
function 函数名([参数1,参数2…]){
函数体;
return 返回值;
}
注:1.函数的参数其实就是局部变量,这些局部变量不指向具体值,叫作形式参数,形参;2. return后面可以是表达式(具体的结果),常量,变量;return只会返回值不会打印值。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>函数01</title>
<script>
//声明一个无参无返回值的函数
function fun(){
alert("我是无参无返回值的函数体");
}
//声明一个有参无返回值的函数
function test(name,age){
//弹出将来传递过来的两个参数值
alert(name+","+age);
}
//声明一个无参有返回值的函数
function show(){
return "hello,world";
}
//声明一个有参有返回值的函数
function f(id){
//将来调用过程中把id的值返回出来
return id;
}
</script>
</head>
<body>
</body>
</html>
当函数执行到某一步时,不想再继续执行,使用return关键字可以打断函数
return除了可以作为一个返回值关键字来使用,也可以进行打断函数的操作;
写在return后面的内容是这个函数的返回值,如return 123;
写在return后面行的内容是不会被执行的内容
3.1.2 调用
1.无参函数的调用
函数名();
2.有参函数的调用
函数名(实际的参数值);
注:调用有参函数时,要传递实际参数值(实参)。实参---->形参传参一定是实参传给形参!!!!!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>函数01</title>
<script>
//声明一个无参无返回值的函数
function fun(){
alert("我是无参无返回值的函数体");
}
//声明一个有参无返回值的函数
function test(name,age){
//形式参数 形参 name="张三" age=18
//弹出将来传递过来的两个参数值
alert(name+","+age); //alert(张三+","+18) 张三,18
}
//声明一个无参有返回值的函数
function show(){
return "hello,world";
}
//声明一个有参有返回值的函数
function f(id){
//形参
//将来调用过程中把id的值返回出来
return id;
}
//无参函数的调用
fun(); //弹出 我是无参无返回值的函数体
show(); //return只返回值不打印值
var ret=show(); //用一个变量ret接收返回值
alert(ret); //弹出hello,world
// alert(show());
//有参函数的调用
test("张三",18); //实参--->形参
// f(103);
alert(f(103)); //实参传形参
</script>
</head>
<body>
</body>
</html>
2.2 匿名函数(赋值式函数)【重点掌握】
- 声明时无函数名
- 只能在声明之后调用
- 可以将匿名函数作为其它函数的参数使用
- 定义匿名变量可以完成某些一次性的事件【DOM中的事件】
2.2.1 声明
用一个变量来接收匿名函数的值
var 变量名=function([形参1,形参2…]){
函数体;
[return 返回值;]
}
2.2.2 调用
通过变量名来调用
格式:
变量名(); 或者 变量名(实参1,实参2…);
注:把匿名函数当作实参,实参传递给形参,通过形参接收匿名函数,拿上形参的名字进行调用。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>匿名函数</title>
&l