1 call和apply,它们的作用都是将函数绑定到另外一个对象上去运行 2 两者的格式和参数定义: 3 call( thisArg [,arg1,arg2,… ] ); // 参数列表,arg1,arg2,... 4 apply(thisArg [,argArray] ); // 参数数组,argArray 5 上面两个函数内部的this指针,都会被赋值为thisArg,这可实现将函数作为另外一个对象的方法运行的目的 6 7 一、call 的简单用法 8 首先,我们先看个简单的例子(call): 9 [html] view plaincopyprint? 10 11 12 13 14call-apply 15 16 17 18 19 20 38 39 54 55 56 然后,运行结果如下: 57 global var 58 global var 59 member var 60 input text 61 func 62 func2 63 测试环境:Google Chrome 10.0.648.45 64 最后,分析结果 65 1、全局对象window调用函数gFunc,this指向window对象,因此this.value为global var 66 2、函数gFunc调用call方法,this默认指向第一个参数window对象,因此this.value也为global var 67 3、函数gFunc调用call方法,this默认指向第一个参数new mFunc(),即mFunc的对象,因此this.value为mFunc的成员变量member var 68 4、函数gFunc调用call方法,this默认指向第一个参数input text控件,即id=‘idTxt’的控件,因此this.value为input控件的value值input text 69 5、函数func2调用call方法,this默认指向第一个参数func函数对象,因此this.value为this.a,即func 70 6、函数func2调用call方法,第二个参数属于函数对象func2的参数,因此alert(x)为第二个参数func2 71 72 二、call 继承用法与改进 73 js使用call模拟继承 74 测试代码: 75 [html] view plaincopyprint? 76 77 78 79 80call - apply for inherit 81 82 83 84 116 117 118 运行结果如下:119 baseB member120 baseB member121 测试环境:Google Chrome 10.0.648.45122 结果分析:123 预期的结果,应该是输出 baseA member 和 baseB member,但实际输出却是 baseB member 和 baseB member124 (已在IE9、8、6,Maxthon、Chrome、FF、Opera、Safari、360等浏览器测试过,结果都是后者:baseB member)125 至此,机器是不会错的,这就需要我们深入分析126 我们可能会很容易想到是this引起的,this两次都指向了baseB对象,但是推测真是这样吗?127 为了探究实质,我们借助chrome浏览器的调试工具,下断点,进行调试,结果发现:128 129 当调用extend.showSelfA();时,此时的this指向extendAB(并不是我们推测的两次都指向baseB对象)130 真实原因是extendAB对象的成员变量member在被baseB.call(this);实例化时,被baseB的成员member覆盖了,即extendAB的成员member由baseA member赋值成了baseB member131 当然,我们也可以对上面baseA代码稍作修改,来验证我们调试分析的正确性:132 function baseA() // base Class A133 {134 this.memberA = "baseA member"; // member改成memberA,以区分baseB中的member135 this.showSelfA = function()136 {137 window.alert(this.memberA); // 显示memberA138 }139 }140 再次运行chrome等浏览器,结果如下:141 baseA member142 baseB member143 结果和我们的预期相同,同时chrome调试信息也验证了我们的正确性:144 145 146 147 继承改进(prototype)148 以上模拟继承方法,仔细分析不是最好的。149 因为每次在函数(类)中定义了成员方法,都会导致实例有副本,因此可以借助prototype原型,进行改进150 改进举例如下:151 [html] view plaincopyprint?152 153 154 155 156call - apply for prototype 157 158 159 160 188 189 190 运行结果如下:191 obj: man and women