js中的call()和apply()方法

Posted 2020-10-05 .tianqi

 在这里主要解决apply以及call的以下几个问题：

   （1）call与apply的常见用法

   （2）call与apply的区别

1.首先我们了解一下call与apply用法的基本定义：

     apply:方法能劫持另外一个对象的方法，继承另外一个对象的属性.  

     fn.apply(obj,args)

     　　obj:劫持函数fn方法的对象，常见将obj用this代替并用实际对象对其进行引用的方式；

     　　args:可以看做为一个数组，它将参数传递给fn;

     fn.call(obj,[param1[,param2[,…[paramN]]]])

apply与call的区别仅限于参数方面，call()方法接受的是若干个参数的列表，而apply()方法接受的是一个包含多个参数的数组。这里我们举一个例子来进行对比

function partial(fn, str1, str2) {
    function result(str3) {
        return fn.call(this, str1, str2, str3);
    }
 
     return result;
}
 

 function partial(fn, str1, str2) {
    function result(str3) {
        return fn.apply(this, [str1, str2, str3]);
    }
 
    return result;
}

另外需要注意，在没有对象对apply函数进行调用时，this可以用null代替，this指向全局变量window；

2.我们再来看一个简单的apply应用

 

<script>
    function argsAsArray(fn, arr) {
        return fn.apply(this, arr)
    }
    console.log(
        argsAsArray(
            function (greeting, name, punctuation) {
                return greeting + ‘, ‘ + name + (punctuation || ‘!‘);
                },
            [‘Hello‘, ‘Ellie‘, ‘!‘])
    )
</script>

分析：fn.apply(this,arr)         在console.log中，我们创建实体对象，此时this即代表argsAsArray(…){…}。返回结果即为Hello,Ellie!

         这里需要注意一点，我们知道，调用argsAsArry对象时，我们需要的不是数组，而是一个个参数，实现这种操作是因为apply可以将一个数组默认的转换为一个参数列表。如([param1,param2,param3] 转换为 param1,param2,param3.

apply与call有更多的灵活用法，但是基于对基本语法的理解，更复杂的效果不难实现。欢迎有更多热爱编程的小伙伴在评论区与我进行讨论