函数的命名方式
JavaScript代码服用单位是函数,函数可以包含一段可执行代码,也可以接受调用者传入的参数。JavaScript定义函数主要有以下三种方式:
- 第一种方式:命名函数
<script>
function 函数名(参数列表){//function声明函数的关键字
要执行的语句块;
}
function myAge(age) {
document.write('我的年龄是' + age)//我的年龄是19
}
myAge(19)//函数不调用,不执行
</script>
- 第二种:匿名函数
<script>
function (参数列表) {//同引用函数调用这个函数
要执行的语句块
}
//匿名函数
var a=function(age) {
document.write('我的年龄是' + age)//我的年龄是19
}
a(19)
</script>
命名函数和匿名函数不同,命名函数前后都可调用,匿名函数只能在函数后面调用才能出现
- 第三种:使用function类构建匿名函数
<script>
new function(参数列表,函数执行体);//构造一个函数,参数列表和函数执行体都要用双引号括起来
//构建匿名函数
var a = new Function('name','age',"document.write('我的姓名:'+name+',我的年龄:'+age)")//我的姓名:小红,我的年龄:20
a("小红",20)
</script>
**强调:**函数的形参不需要做类型声明,也不要加var,这是JavaScript属于弱类型语言的一种表现
大多数优秀的JavaScript框架都使用第二种“匿名函数”语法来定义函数,他的可读性最好,所以我们必须掌握使用它。
函数常用的特殊语句
- 函数的返回值
return
JavaScript中的函数没有声明返回类型,当函数想要返回值的时候直接加上return“值”语句即可,假如不加就代表此函数没有任何返回值
<script>
//return
function show() {
return function(){
alert("美女")//打印美女
}
}
var f=show();
f();
</script>
- 局部变量和局部函数
根据变量的定义范围不同,变量有全局变量和局部变量之分。
在函数外部直接定义的变量是全局变量,在函数中定义的变量成为局部变量,局部变量只能在函数内有效,如果全局变量和局部变量使用相同的变量,则局部变量将覆盖全局变量。
与局部变量对应的是局部函数,局部函数实在函数中定义的,全局变量可以在外部直接访问,内部变量只能在函数内部访问
注意:全局变量不能调用局部变量,局部变量可以调用内部变量
<script>
//全局变量
var name="美女"//全局变量
function show(){
var name="美女"
var age=10;
alert(name+"---"+age);//打印 美女---10
}
alert(name)//全局变量和局部变量使用相同的变量,则局部变量将覆盖全局变量。
alert(age) //全局变量可以在外部直接访问,内部变量只能在函数内部访问
show();
//局部变量
function f1() {
var name ="张三";
function f2() {
var age = 30;
alert(name);
}
//alert(age);//错误的 全局函数是不能访问局部函数内部的局部变量
f2();
}
f1();
//闭包:闭包是指有权访问另一个函数作用域中变量的函数
function f3() {
var n=1;
function f4() {
alert(n);
}
return f4;
}
var f=f3();
f();
</script>
JavaScript的3种调用函数的方式:
- 直接调用函数:这种函数的调用是最常见、最普通的方式
对象.函数引用:
//当声明一个函数没有指明分配给哪个对象使用的时候,默认分配给的是window对象。
<scrit>
function show(name,age) {
alert("你好"+name+",今年"+age)
}
window.show('张三','20') //对象.函数名 默认分配给的是window对象
</script>
- 以call方法调用函数:
函数引用.call(调用者,参数1,参数2,…)
<scrit>
function show(name,age) {
alert("你好,我是"+name+",今年"+age)
}
show.call(window,'张三','20');
</script>
- 以apply方法调用函数:
函数引用.apply(调用者,arguments)
//arguments相当于是数组,用来存放多个参数。和call调用方式类似
<scrit>
function show(name,age) {
alert("你好,我是"+name+",今年"+age)
}
show.apply(window,['张三','20']);
</script>
对方法2和方法3的一个扩展小案例
<script>
function show(arr,func) {
func.call(window,arr);
}
show([1,2,3,4],function (arr) {//用匿名函数传递
for(i in arr){//遍历这个函数
document.write(arr[i]+"<br/>")
}
})
document.write("_______"+"<br>")
function show(arr,func) {
func.apply(window,[arr]);
}
show([1,2,3,4],function (arr) {//以数组形式传参
for(i in arr){//遍历这个函数
document.write(arr[i]+"<br/>")
}
})
//第一种比较常用,但第二种和第三种比较灵活
</script>