最近在使用jQuery的$.each方法时很,突然想到$.each($(‘div'),function(index,entity){});中的这个index和entity是哪冒出来的,而且可有可无的,而且这么高大上的能告诉我们当前遍历的下标和实例。所以看了一下jQuery源代码,是这么写的:
调试的时候走的是标红的这段代码,然后用到了callback.call这个函数,于是翻看了一下《js高级程序设计》,其中有比较深的解释。
首先,function是一个指向Function对象,函数名是一个指向函数的指针。那么在函数体内,就会有一个作用域,即this关键字。
this关键字指的是函数运行的作用域,举个例子来说:
<script type="text/javascript"> function funcA() { alert(this); alert("Function A"); } </script>
上面这段代码中的函数funcA定义在全局环境中,那么函数体内的this即window对象。
下面该到call和apply的说明了。以call函数为例,call的第一个参数,就是改变函数的作用域,后面的参数为传入函数的所需的参数,必须与原函数的参数一直,举例说明:
<script type="text/javascript"> var testO = { name: "Lily" }; function funcA(a,b) { alert(this); alert("Function A"); }function funcB(a, b) { funcA.call(testO, a, b); }
funcB(1,2); //this变成了testO </script>
我们定义funcB函数的中,调用了funcA的call函数,这个时候我们改变了funcA中this的指向,原本指向window的,现在指向了call的第一个参数testO这个对象。而且调用call时,因为funcA函数有两个参数,所以如果要想funcA传递参数,必须一一指出参数,即后面的两个参数a和b,或者可以只穿第一个参数
即:funcA.call(testO);或者只传a,即:funcA.call(testO,a);
而apply与call的区别仅在于,apply的第二个参数可以是数组形式,而且不必一一指出参数,funcA.apply(testO,[a,b])
介绍完call与apply的基本用法,该说说他哥俩真正的用武之地了,扩充函数赖以运行的作用域。
<script type="text/javascript"> window.color = "透明"; var testObj = { color: "红色" };function testFuc() { alert(this.color); }
$(function () { 1.testFuc(); //弹出“透明” 2.testFuc(this); //弹出“undefined” 3.testFuc.call(this.parent); //弹出“透明” 4.testFuc.call(window); //弹出“透明” 5.testFuc.call(testObj); //弹出“红色” }); </script>
上面这段代码演示了call的作用。第一个函数调用,this指向了window,所以弹出了window的color属性。
第二个函数可能有些朋友以为也会弹出透明,但是请先确定我们的函数运行在$(function(){});中,这个jQuery的函数,了解jQuery的朋友都很清楚,在
$(function(){});中this的作用域指向的是document,然后我们调用testFunc,要弹出document的color,当然是未定义的。
第三个函数将testFunc的this指向了document的亲爹window,弹出window的color当然也是没有问题的。
第四个函数就更加直白了,把window传进去了
第五个函数,将testFunc的this指向了testObj,弹出了红色。
讲到这里,用法大家应该都有所了解了,但是具体怎么去理解怎么去使用还是看自己的套路。
我是这么理解的,可以把这种用法看成是C#或者java中的泛型方法。比如一个C#方法的定义
public void Test<T>(T a, T b) { }
这样我们就可以实现对方法的扩展,实现通用的目的。
以上都是本人自己的看法和观点,有什么不对之处还请大家指出来共同学习。
本文向大家介绍JavaScript函数apply()和call()用法与异同分析,包括了JavaScript函数apply()和call()用法与异同分析的使用技巧和注意事项,需要的朋友参考一下 本文实例分析了JavaScript函数apply()和call()用法与异同。分享给大家供大家参考,具体如下: JavaScript的函数是对象,因此有属性和方法。每个函数都包含两个属性:length和p
本文向大家介绍javascript中call apply 与 bind方法详解,包括了javascript中call apply 与 bind方法详解的使用技巧和注意事项,需要的朋友参考一下 在JavaScript中,call、apply和bind是Function对象自带的三个方法,本文将通过几个场景的应用,来详细理解三个方法。 call() call() 方法在使用一个指定的this值和若干个
本文向大家介绍javascript中call和apply的用法示例分析,包括了javascript中call和apply的用法示例分析的使用技巧和注意事项,需要的朋友参考一下 call和apply的用法,并利用call实现js类的继承 演示图: 以上所述就是本文的全部内容了,希望大家能够喜欢。
本文向大家介绍javascript中call,apply,bind的用法对比分析,包括了javascript中call,apply,bind的用法对比分析的使用技巧和注意事项,需要的朋友参考一下 关于call,apply,bind这三个函数的用法,是学习javascript这门语言无法越过的知识点。下边我就来好好总结一下它们三者各自的用法,及常见的应用场景。 首先看call这个函数,可以理解成"借
本文向大家介绍JavaScript中的call方法和apply方法使用对比,包括了JavaScript中的call方法和apply方法使用对比的使用技巧和注意事项,需要的朋友参考一下 方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象。 说明: call 方法可以用来代替另
本文向大家介绍Apply和call方法的异同 相关面试题,主要包含被问及Apply和call方法的异同 时的应答技巧和注意事项,需要的朋友参考一下 相同点:两个方法产生的作用是完全一样的,第一个参数都是对象; 不同点: call()方法参数将依次传递给借用的方法作参数,即fn.call(thisobj, arg1,arg2,arg3...argn),有n个参数 apply()方法第一个参数是对象,