我一直认为代码是最能说明问题的.必要的地方我写有注释.参考一些相关的文章.下面的代码做了进一步的探讨.或许能让理解call和apply更进一步!
function log(a) {
//我习惯使用firebug和chrome自己的调试器.您也可以手动修改为alert
console.log(a);
}
function ObjB() {
this.message = "messageB";
this.setMessage = function(arg) {
this.message = arg;
};
}
function ObjA() {
this.message = "messageA";
this.getMessage = function() {
return this.message;
};
}
var b = new ObjB();
var a = new ObjA();
//可以直接访问属性.输出为messageA
log(a.message);
//给对象ObjA动态指派ObjB的setMessage方法,注意,ObjA本身是没有这方法的!
b.setMessage.call(a, "A的消息");
//输出"A的消息"
log(a.getMessage());
//给对象b动态指派a的getMessage方法,注意,b本身也是没有这方法的!可以理解为得到A里面的getMessage方法体.然后用call注入到B里面执行.因为上下文变成了B,所以B多了getMessage方法体.
var result = a.getMessage.call(b);
//输出"messageB"
log(result);
//Uncaught TypeError: Object #<ObjB> has no method 'getMessage' 出错了.因为call并没有把getMessage永久注入进ObjB
//log(b.getMessage());
function print(a, b, c, d) {
log("调用者是:" + arguments.callee.caller.name + " 上下文是:" + this + " 参数是:" + a + b + c + d);
}
//通过example里面 的三次调用,可以看出:call, apply方法区别是,从第二个参数起, call方法参数将依次传递给借用的方法作参数, 而apply直接将这些参数放到一个数组中再传递, 最后借用方法的参数列表是一样的.
function example1(a, b, c, d) {
//用call方式借用print,参数次序传递.
print.call(this, a, b, c, d);
//用apply方式借用print, 参数作为一个数组传递,
//这里直接用JavaScript方法内本身有的arguments数组
print.apply(this, arguments);
//或者封装成数组
print.apply(this, [a, b, c, d]);
}
//此方法和example1一样.但是突出分析this代表什么东西.
function example2(a, b, c, d) {
print.call(window, a, b, c, d);
print.apply(window, arguments);
print.apply(window, [a, b, c, d]);
}
example1("参数1", "参数2", "参数3", "参数4");
example2("参数1", "参数2", "参数3", "参数4");
/* -----------------------------------------------------------------*/
function SimulateFun() {
this.print = function(a, b, c, d) {
log("调用者是:" + arguments.callee.caller.name + " 上下文是:" + this + " 参数是:" + a + b + c + d);
}
}
var simulateFun = new SimulateFun();
function example3(a, b, c, d) {
simulateFun.print.call(this, a, b, c, d);
simulateFun.print.apply(this, arguments);
simulateFun.print.apply(this, [a, b, c, d]);
}
example3("参数1", "参数2", "参数3", "参数4");
/* -----------------------------------------------------------------*/
function ContentSimulate() {
this.example4 = function example4(a, b, c, d) {
simulateFun.print.call(this, a, b, c, d);
simulateFun.print.apply(this, arguments);
simulateFun.print.apply(this, [a, b, c, d]);
}
this.example5 = function example5(a, b, c, d) {
print.call(this, a, b, c, d);
print.apply(this, arguments);
print.apply(this, [a, b, c, d]);
}
}
var contentSimulate = new ContentSimulate();
//这里的上下文变成了ContentSimulate对象
contentSimulate.example4("参数1", "参数2", "参数3", "参数4");
//这里的上下文变成了ContentSimulate对象
contentSimulate.example5("参数1", "参数2", "参数3", "参数4");
分享到:
相关推荐
JavaScript中call与apply方法
1、call,apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例(就是每个方法)都有call,apply属性。既然作为方法的属性,那它们的使用...
理解JavaScript的caller callee call apply
javascript callApply代码示例
淡淡简单描述javascript中方法apply和call
我们可以将call和apply看做是某个对象的方法,通过调用方法的形式来间接调用函数
浅谈javascript中的call、apply、bind_.docx
本文实例分析了JavaScript中call和apply方法的区别。分享给大家供大家参考,具体如下: 这两个方法不经常用,但是在某些特殊场合中是非常有用的,下面主要说下它们的区别: 1、首先,JavaScript是一门面向对象的语言...
本文主要Javascript中call,apply,bind方法的进行全面分析,并在文章结尾对call,apply,bind方法的联系和区别做了总结,具有很好的参考价值,需要的朋友一起来看下吧
主要介绍了javascript中call,apply,bind函数用法,结合实例形式分析了call,apply,bind函数的功能、使用方法与相关注意事项,需要的朋友可以参考下
JavaScript函数之call、apply以及bind方法案例详解 总结 1、相同点 2、区别 call() 方法 /* 正常模式 */ let obj = { sum(a, b) { console.log(this) return a + b } } // 执行 sum 函数的 apply、bind...
call(obj,arg1,arg2,arg3);call第一个参数传对象,可以是null。参数以逗号分开进行传值,参数可以是任何类型。 apply(obj,[arg1,arg2,arg3]);apply第一个参数传对象,参数可以是数组或者arguments 对象。 这两个...
深化理解关于javascript中apply()和call()方法的区分_.docx
JavaScript中的apply和call函数详解_.docx
JavaScript 中通过call或者apply用来代替另一个对象调用一个方法,将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。简单的说就是改变函数执行的上下文,这是最基本的用法。两个方法基本区别...
主要介绍了javascript中call,apply,callee,caller用法,结合实例形式分析了javascript中call,apply,callee,caller功能、使用方法及相关操作注意事项,需要的朋友可以参考下
call, apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例,也就是每个方法都有call, apply属性.