callee与caller,apply与call的区别和作用

--------------------------------------

~~callee 被调用者  caller调用者

arguments.callee  作为arguments对象的属性 返回对函数自身的引用;arguments.callee.length 形参个数

fn.caller  返回被调用函数fn的父函数 若fn是在全局作用域下调用的 则 返回null

fn.apply(thisObj,arguments)  函数作为另一个对象的方法被调用 第二个参数为数组

fn.call(thisObj,arg1,arg2..)  函数作为另一个对象的方法被调用 第1个参数后为 参数列表

-----------------------------------
可能不少学习javascript在使用call,apply,callee时会感到困惑,以下希望对于你有所帮助:

1、它是函数的方法或属性; ~~~call ,apply是函数(函数对象)的方法;callee是函数arguments对象的属性 引用函

数自身

2、它可以改变执行上下文的this指向;~~~call,apply改变上下文对象this的指向

3、作为另一个对象调用一个方法(即可以把一个对象的方法作为另一个对象的方法来引用);  ~~作为另一个对象的

方法被调用

4、apply方法类似,但只能接收数组为参数;~~ apply方法只能接受数组作为参数

5、callee函数的调用者。

f.call(o,1,2) 等同于
o.m = f;
o.m(1,2);

例1:
function o1(value){
if(value < 100){
this.value = value;
}else{
this.value = 100;
}
}

function o2(value){
o1.call(this,value); //改变o1函数中,上下文对象this的指向
alert(this.value);
}

var o = new o2(133554) //100  改变了this的指向

例2:
function c1(){
this.m1 = function(){
alert(this.name);
}
}

function c2(){
this.name = “mike”;
}
var nc1 = new c1();
var nc2 = new c2(); //必须
nc1.m1.call(nc2);  //mike 把方法m1作为对象nc2的方法来引用

例3:
function o1(arg){
if (arguments[1] < 100) {
this.value = arguments[1] ;
}
else {
this.value = 100;
}
}

function o2(arg){
o1.apply(this, arg);
alert(this.value);
}

var o = new o2([101,60]) //60 参数只能是数组

callee用法,常用于匿名函数中
var factorial = function(x){
if(x <= 1){
return 1;
}
return x * arguments.callee(x - 1); //回调函数自身
}
alert(factorial(5)); //120


---------------------------------------------------------------------------------


二、apply方法
apply方法的第一个参数也是要传入给当前对象的对象,即函数内部的this。后面的参数都是传递给当前对象的参数


对于apply和call两者在作用上是相同的,但两者在参数上有区别的。对于第一个参数意义都一样,但对第二个参数

:apply传入的是一个参数数组,也就是将多个参数组合成为一个数组传入,而call则作为call的参数传入(从第二

个参数开始)。
如 func.call(func1,var1,var2,var3)对应的apply写法为:func.apply(func1,[var1,var2,var3])同时使用apply的

好处是可以直接将当前函数的arguments对象作为apply的第二个参数传入。

~~~~使用apply最大的好处,可以将当前函数的arguments对象(arguments是伪数组)作为apply的第二个参数传入。

Js代码

复制代码 代码如下:

 
var func=new function(){this.a="func"}
var myfunc=function(x,y){
var a="myfunc";
alert(this.a);
alert(x + y);
}

//call 与 apply调用时传入参数的差别
 
myfunc.call(func,"var"," fun");// "func" "var fun"
myfunc.apply(func,["var"," fun"]);// "func" "var fun"


三、caller 属性

返回一个对函数的引用,即调用了当前函数的函数体。
functionName.caller :functionName 对象是所执行函数的名称。
说明:
对于函数来说,caller 属性只有在函数执行时才有定义。 如果函数是由 JScript 程序的顶层调用的,那么 caller

包含的就是 null 。如果在字符串上下文中使用 caller 属性,那么结果和 functionName.toString 一样,也就是

说,显示的是函数的反编译文本。

Js代码

复制代码 代码如下:

 
function CallLevel(){
if (CallLevel.caller == null)
alert("CallLevel was called from the top level.");
else
alert("CallLevel was called by another function:\n"+CallLevel.caller);
}

function funCaller(){
CallLevel();
}

CallLevel();

funCaller();


四、callee属性
返回正被执行的 Function 对象,也就是所指定的 Function 对象的正文。
[function.]arguments.callee:可选项 function 参数是当前正在执行的 Function 对象的名称。
说明:
callee 属性的初始值就是正被执行的 Function 对象。
callee 属性是 arguments 对象的一个成员,它表示对函数对象本身的引用,这有利于匿
函数的递归或者保证函数的封装性,例如下边示例的递归计算1到n的自然数之和。而该属性
仅当相关函数正在执行时才可用。还有需要注意的是callee拥有length属性,这个属性有时
用于验证还是比较好的。arguments.length是实参长度,arguments.callee.length是
形参长度,由此可以判断调用时形参长度是否和实参长度一致。
Js代码

复制代码 代码如下:

 
//callee可以打印其本身
function calleeDemo() {
alert(arguments.callee);
}
calleeDemo();


//用于验证参数
function calleeLengthDemo(arg1, arg2) {
if (arguments.length==arguments.callee.length) {
window.alert("验证形参和实参长度正确!");
return;
} else {
alert("实参长度:" +arguments.length);
alert("形参长度: " +arguments.callee.length);
}
}

//递归计算
var sum = function(n){
if (n <= 0)
return 1;
else
return n +arguments.callee(n - 1)
}


五、bind
Js代码

复制代码 代码如下:

 
var first_object = {
num: 42
};
var second_object = {
num: 24
};
function multiply(mult) {
return this.num * mult; //全局作用域下定义的 this指向window
}
//把函数对象绑定到指定对象,作为该对象的方法,并返回该对象的方法
Function.prototype.bind = function(obj) {
var method = this,
temp = function() {
return method.apply(obj, arguments);
};
return temp;
}
var first_multiply = multiply.bind(first_object); //绑定上下文对象 并返回包装原函数的匿名函数
first_multiply(5); // returns 42 * 5
var second_multiply = multiply.bind(second_object);
second_multiply(5); // returns 24 * 5

posted @ 2013-04-10 17:35  stephenykk  阅读(782)  评论(0编辑  收藏  举报