call,apply,bind的区别

最新推荐文章于 2025-08-05 21:00:00 发布

转载最新推荐文章于 2025-08-05 21:00:00 发布 · 71 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/sunmarvell/p/9168005.html

本文详细解析了JavaScript中call、apply与bind方法的区别与联系，并通过具体示例展示了如何使用这些方法来控制函数的this上下文指向，以及如何通过它们实现函数的部分应用。

call、apply、bind方法的共同点和区别：
apply 、 call 、bind 三者都是用来改变函数的this对象的指向的；
apply 、 call 、bind 三者第一个参数都是this要指向的对象，也就是想指定的上下文（函数的每次调用都会拥有一个特殊值——本次调用的上下文（context）——这就是this关键字的值。）；
apply 、 call 、bind 三者都可以利用后续参数传参；
bind 是返回对应函数，便于稍后调用；apply 、call 则是立即调用。

用一个实例来说明吧。

已知函数 fn 执行需要 3 个参数。请实现函数 partial，调用之后满足如下条件：
1、返回一个函数 result，该函数接受一个参数
2、执行 result(str3) ，返回的结果与 fn(str1, str2, str3) 一致

输入：

var sayIt = function(greeting, name, punctuation) {     return greeting + ', ' + name + (punctuation || '!'); }; 
partial(sayIt, 'Hello', 'Ellie')('!!!');

输出：

Hello, Ellie!!!

call和apply必须显式地调用str3，立即执行

bind不是立即执行，未传入str3时，并未执行，只是返回一个函数，等待参数传入

// call
function partial(fn, str1, str2) {
    function result(str3) {
        return fn.call(this, str1, str2, str3);
//指定上下文为this，之后参数挨个依次传入
    }
 
     return result;
}

// apply
function partial(fn, str1, str2) {
    function result(str3) {
        return fn.apply(this, [str1, str2, str3]);
//参数以数组的形式传入
    }
 
    return result;
}

bind不加后面的括号返回的是函数，加上后面的括号返回的是函数值，这也是bind和call和apply的主要区别，bind需要二次调用，而call和apply返回的是函数值，是直接调用。这道题让我更理解了三者的区别。

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

转载于:https://www.cnblogs.com/sunmarvell/p/9168005.html