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

Posted .tianqi

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js中的call()和apply()方法相关的知识,希望对你有一定的参考价值。

 在这里主要解决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有更多的灵活用法,但是基于对基本语法的理解,更复杂的效果不难实现。欢迎有更多热爱编程的小伙伴在评论区与我进行讨论

 

以上是关于js中的call()和apply()方法的主要内容,如果未能解决你的问题,请参考以下文章

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

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

js中的call和apply简单演示

js插件进阶JS中的call()和apply()方法详解

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

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