定义一个函数之后, JavaScript 提供了 3 种调用函数的方式。
1 直接调用函数
直接调用函数是最常见、最普通的方式。
//调用 window 对象的 alert 方法
window.alert( "测试代码") ;
当程序使用 window 对象来调用方法时,可以省略方法前面的 window 调用者。
2 以 call()方法调用函数
可以直接调用函数,并且可以通过第一个实参来指定函数中this
call是直接传递函数的实参
用法:函数 .call (调用者 , 参数 1 , 参数 2...)
由此可知直接调用函数与通过 call()调用函数的关系如下:
调用者 . 函数(参数 1 , 参数 2 . .. ) =函数 . call (调用者 , 参数 1 , 参数 2...)
代码示例:
<script>
var each = function(array,fn){
for(var index in array){
// 等价null可以换成window
fn.call(null,index,array[index]);
fn.call(window,index,array[index]);
fn(index,array[index]);
}
}
each([4,20,3],function(index,ele){
document.write("第"+index+"个元素"+ele+"<br/>");
});
</script>
运行结果:(三种形式调用)
3 以 apply()方法调用函数
与call()的区别:
- 通过 call()调用函数时,必须在括号中详细地列出每个参数。
- apply()需要将实参封装到一个数组中传递
apply()和 call()的对应关系如下:
函数引用.call (调用者, 参数 1, 参数 2...) =函数引用. apply (调用者, [参数 1 , 参数 2 . .. ])
(***)函数的独立性
JavaScript 的函数是“ 一等公民”,它永远是独立的,函数永远不会从属于其他类、对象。
在任何类里面的函数,都具有独立性,无论那个对象,只要找到了对应的函数所在的’路径‘,任何对象都可以通过call的形式调用。
代码示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
function Person(name){
this.name = name;
// 定义一个info方法
this.info = function(){
document.writeln("我的名字是"+this.name+"<br\>");
}
}
function Person1(name){
this.name = name;
}
var p = new Person("p对象的");
var w = new Person1("w对象的");
// 调用p对象的info方法
p.info();
p.info.call(p);
var name = "全局变量属于window";
p.info.call(window);
p.info.call(w);
</script>
</body>
</html>
运行结果: