apply call bind 三者的比较

apply、call、bind三者相比较，之间又有什么异同呢?何时使用apply、call，何时使用bind呢？举个简单的例子：

var obj = {
    
    
    x : 81,
};
var foo = {
    
    
    getX: function () {
    
    
        return this.x;s
    }
};
console.log(foo.getX.bind(obj)()),
console.log(foo.getX.call(obj)),
console.log(foo.getX.apply(obj))

打印结果：
在这里插入图片描述
三个输出的都是81，但是注意看使用bind()方法的，他后面多了对括号。

也就是说，区别是，当你希望改变上下文环境之后并非立即执行，而是回调执行的时候，使用bind)方法。而 apply/call则会立即执行函数。

apply、call区别
对于apply、call二者而言，作用完全一样，只是接受参数的方式不太一样。例如，有一个函数定义如下:

    var func = fuction( arg1 , arg2 ) {
    
    

    };

调用：

func.call( this , arg1 , arg2 );
func.apply( this, [ arg1 , arg2 ])

总结：
apply . call . bind 三者都是用来改变函数的this对象的指向的;
apply ,call、bind 三者第一个参数都是this要指向的对象，也就是想指定的上下文;
apply . call . bind三者都可以利用后续参数传参;
bind是返回对应函数，便于稍后调用; apply . call则是立即调用。

有个有趣的问题，如果连续bind()两次，亦或者是连续bind()三次那么输出的值是什么呢?像这样:

    var bar = function(){
    
    
        console.log(this.x)
    }
    var foo = {
    
    
        x : 3
    }
    var sed = {
    
    
        x : 4
    }
    var func = bar.bind(foo).bind(sed)
    func()

    var fiv = {
    
    
        x : 5
    }
    var func = bar.bind(foo).bind(sed).bind(fiv)
    func()

打印结果如下：
在这里插入图片描述
答案是，两次都仍将输出3，而非期待中的4和5。原因是，在Javascript中，多次bind()是无效的。更深层次的原因，bind()的实现，相当于使用函数在内部包了一个call / apply，第二次bind()相当于再包住第一次bind(),故第二次以后的bind是无法生效的。

apply call bind 三者的比较

猜你喜欢