JavaScript中apply()和call()方法

Author : luckyGirl

在上一篇博文中What does this refer to in javascript?中讨论了在JavaScript中this在不同情况下的指代, 其中有一种是通过apply()和call()调用函数时,函数可以扩充其赖以运行的作用域, 由于对这2个函数不太熟悉,在网上进行查询,稍微了做了些笔记,与大家分享,若有不对滴地方也希望大家能够帮忙纠正.

apply(thisObj,argArray])
thisObj: 可选, 要用作 this 对象的对象,如果为null时,则使用全局对象使用
argArray: 可选,要传递到函数的一组参数, 如果 argArray 不是有效对象,则会出现“应为对象”错误
示例:
function callMe(arg1, arg2){
 var s = “”; s += “this value: ” + this; s += “<br />”; 
 for (i in callMe.arguments) { s += “arguments: ” + callMe.arguments[i]; s += “<br />”; } 
     return s; 
 } 
 document.write(“Original function: <br/>”); 
 document.write(callMe(1, 2)); document.write(“<br/>”); 
 document.write(“Function called with apply: <br/>”); 
 document.write(callMe.apply(3, [ 4, 5 ])); 
 // Output: 
 // Original function: 
 // this value: [object Window] 
 // arguments: 1 
 // arguments: 2 
 // Function called with apply: 
 // this value: 3 
 // arguments: 4 
 // arguments: 5
call(thisObj,arg1,arg2,,argN)
thisObj: 可选,要用作 this 对象的对象,如果为null时,则使用全局对象使用
arg1,arg2,,argN: 可选,要传递给方法的参数的列表。
示例:
function callMe(arg1, arg2){
    var s = “”;
    s += “this value: ” + this;
    s += “<br />”;
    for (i in callMe.arguments) {
        s += “arguments: ” + callMe.arguments[i];
        s += “<br />”;
    }
    return s;
}
document.write(“Original function: <br/>”);
document.write(callMe(1, 2));
document.write(“<br/>”);
document.write(“Function called with call: <br/>”);
document.write(callMe.call(3, 4, 5));
// Output: 
// Original function: 
// this value: [object Window]
// arguments: 1
// arguments: 2
// Function called with apply: 
// this value: 3
// arguments: 4
// arguments: 5
以上可见,二者的区别是传入参数的形式不一样,apply()是以数组形式传入参数,而call()的参数形式为列表,根据参数形式不同可以使用不同方法.
apply()也有一些其他巧妙用法
1. Math.max()函数可传入任意参数,最后返回参数的最大值
   如,
     alert(Math.max(5,8))   //8
     alert(Math.max(5,7,9,3,1,6))   //9
   但是在很多情况下,我们需要找出数组中最大的元素。
    var arr=[5,7,9,1]
    alert(Math.max(arr))    //   这样却是不行的。一定要这样写
    function getMax(arr){
        var arrLen=arr.length;
        for(var i=0,ret=arr[0];i<arrLen;i++){
        ret=Math.max(ret,arr[i]);        
        }
        return ret
    }
   这样写通常很低效,可以使用apply(),代码就简介很多:
   function getMax2(arr){
return Math.max.apply(null,arr)
}
2. 数组的push方法
  var arr1=[1,3,4];
  var arr2=[3,4,5];
   若希望将arr2追加到arr1上,使 arr1 = [1,3,4,3,4,5],若用push方法只能,
   var arrLen=arr2.length
   for(var i=0;i<arrLen;i++){
        arr1.push(arr2[i])
    }
  如果使用apply(),事情就又变得简单了
  Array.prototype.push.apply(arr1,arr2)
看来关于apply()的应用还得靠以后的使用中慢慢体会~~
standard

Have your say