javascript call与apply关键字的作用

apply接受两个参数。第一个参数指定函数体内this对象的指向，第二个参数为一个带下标的集合。

call则是apply的语法糖，如果参数数量固定，则可以不用带下标的集合传第二个参数。

1 2 3 4 5 6

var func = function(a,b,c) {     alert(a + b + c); } func.apply(null,[1,2,3]);//弹出6 func.call(null,1,2,3);//弹出6

当apply与call传入的第一个参数为null时，函数体内的this会指向window。

call与apply的用途

---

1、改变this的指向

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

var obj1 = {     name = '刘备' }   var obj2 = {     name = '曹操' } var getName = function(){     alert(this.name); }   window.name = '三国'; getName();//弹出"三国" getName.call(obj1);//弹出"刘备" getName.call(obj2);//弹出"曹操"

所以，当在一些情况下this被莫名改变指向之后，可以使用call或apply来进行修正this的指向。

1 2 3 4 5 6 7

document.getElementById('div1').onclick = function(){     alert(this.id);//div1     var fun1 = function(){         alert(this.id);//window.id 即undefined     }     fun1();//普通函数的方式调用，this指代window,相当于window.id 即 undefined }

由于是普通函数的方式调用，所以上面的例子中，this已经变成了window。下面看看如何使用call进行修正。

1 2 3 4 5 6 7

document.getElementById('div1').onclick = function(){     alert(this.id);     var fun1 = function(){         alert(this.id);     }     fun1.call(this);//强制函数内的this为外层的this， }

2、调用其他对象的函数

示例1：

1 2 3 4 5 6 7 8 9 10 11 12 13 14

var obj1 = {     a:1,     b:2,     add:function()     {         return this.a + this.b;     } } var obj2 = {     a:1,     b:2, } var result = obj1.add.call(obj2);//用obj1的函数来计算obj2的两个属性的和 alert(result);//输出3

示例2：借用构造函数实现类似继承的效果

1 2 3 4 5 6 7 8 9 10 11 12

var A = function(name) {     this.name = name; }; var B = function(){     A.apply(this,arguments) } B.prototype.getName = function(){     return this.name; } var b = new B('刘备'); alert(b.getName());