call()、apply()、bind()三者的区别和使用?

6,440 阅读1分钟

函数的方法 call()、apply()、bind()的区别?

call()、apply()、bind()的意义

改变函数执行时的上下文,也就是改变this指向;

语法:

先举一个简单的例子:

/* // 所有在全局的函数,里边this的指向全是window
        function demo(){
            console.log(this);   //this指向window
        }
        demo(); */

- [ 1. call() 方法使用一个指定的this值和单独给出的一个或多个参数来调用一个函数。]

//this 永远指向最后调用它的那个对象
        var obj1={
            name:"小明",
            fn1:function(val1,val2) {
                console.log(this.name,val1,val2);
            }
        }       
        var obj2={
            name:"小红",
            fn2:function() {
                console.log(this.name);
            }
        }
        this.obj1.fn1.call(obj2,111,222);   //this指向改变为obj2

- [ 2. apply() 方法使用一个指定的this值和单独给出的 一个或多个参数的数组 来调用一个函数。]

//this 永远指向最后调用它的那个对象
        var obj1={
            name:"小明",
            fn1:function(a,b) {
                console.log(this.name,a,b);
            }
        }       
        var obj2={
            name:"小红",
            fn2:function() {
                console.log(this.name);
            }
        }
        this.obj1.fn1.apply(obj2,[123,456]);  //this指向改变为obj2

- [ 3. bind() 方法也改变this指向,但会返回一个新的函数,需要再次调用。]

//this 永远指向最后调用它的那个对象
        var obj1={
            name:"小明",
            fn1:function(val) {
                console.log(this.name);
            }
        }       
        var obj2={
            name:"小红",
            fn2:function() {
                console.log(this.name);
            }
        }
        var newfn3=obj1.fn1.bind(obj2);  //this指向改变为obj2
        newfn3();