JavaScript中Apply和Call原理分析与使用
不同的定义
- JavaScript函数或者说是对象中定义的函数可以动态的绑定到另一个函数中，即即使函数f2中未定义函数f1中的子函数ff1，f2也可以调用ff1，apply与call可以实现这种用法。
- JavaScript对apply和call的解释是：使用指定对象替换当前对象并调用函数。
- apply和call：它们的作用都是将函数绑定到另外一个对象上去运行，两者仅在定义参数上不同。
详细介绍
JavaScript动态变换运行时上下文特性,这种特性主要就体现在apply, call两个方法的运用上.
call, apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例,也就是每个方法都有call, apply属性.既然作为方法的属性,那它们的使用就当然是针对方法的了.这两个方法是容易混淆的,因为它们的作用一样,只是使用方式不同.
区分apply,call就一句话,
foo.call(this, arg1,arg2,arg3) == foo.apply(this, arguments)==this.foo(arg1, arg2, arg3)
相同点:两个方法产生的作用是完全一样的
不同点:方法传递的参数不同我们就上面的foo.call(this, arg1, arg2, arg3)展开分析.foo是一个方法,this是方法执行时上下文相关对象,arg1, arg2, arg3是传给foo方法的参数.这里所谓的方法执行时上下文相关对象, 如果有面向对象的编程基础,那很好理解,就是在类实例化后对象中的this.
在JavaScript中,代码总是有一个上下文对象,代码处理该对象之内. 上下文对象是通过this变量来体现的, 这个this变量永远指向当前代码所处的对象中.
引用网上一个代码段，运行后自然就明白其道理。
<input type="text" id="myText" value="input text">
<script>
function Obj(){this.value="对象！";}
var value="global 变量";
function Fun1(){alert(this.value);}
window.Fun1(); //global 变量
Fun1.call(window); //global 变量
Fun1.call(document.getElementById('myText')); //input text
Fun1.call(new Obj()); //对象！
</script>
call函数和apply方法的第一个参数都是要传入给当前对象的对象，及函数内部的this。后面的参数都是传递给当前对象的参数。
运行如下代码：<script>
var func=new function(){this.a="func"}
var myfunc=function(x){
var a="myfunc";
alert(this.a);
alert(x);
}
myfunc.call(func,"var");
</script>可见分别弹出了func和var。到这里就对call的每个参数的意义有所了解了。
这就是动态语言 JavaScript call的威力所在!
参考资料
http://www.cnblogs.com/fighting_cp/archive/2010/09/20/1831844.html
http://www.cnblogs.com/cc258/archive/2012/04/21/2462547.html