天天看点

call(),apply(),bind()的含义和区别

var name = '小王', age=1;
var obj = {
    name: '老王',
    age: 30,
    objAge: this.age, //this指向window
    goFun: function () {
        // this指向obj
        console.log('我是' + this.name + ',我' + this.age + '岁了');
    }
};

obj.objAge; //1
obj.goFun(); //我是老王,我30岁了

           

1、call()、apply()、bind() 都是用来重定义 this 这个对象的!

var name = '小王', age=1;
var obj = {
    name: '老王',
    age: 30,
    objAge: this.age,
    goFun: function () {
        console.log('我是' + this.name + ',我' + this.age + '岁了');
    }
};
var db = {
    name: '小米',
    age: 40
};
obj.goFun.call(db); //我是小米,我40岁了
obj.goFun.apply(db); //我是小米,我40岁了
obj.goFun.bind(db)(); //我是小米,我40岁了
           

this指向了参数db(如果不加参数,则指向window)

以上出了 bind 方法后面多了个 () 外 ,结果返回都一致!

由此得出结论,bind 返回的是一个新的函数,你必须调用它才会被执行。

2、对比call 、bind 、 apply 传参情况下

var name = '小王', age=1;
var obj = {
    name: '老王',
    age: 30,
    objAge: this.age,
    goFun: function (val1,val2) {
        console.log('我是' + this.name + ',我' + this.age + '岁了,从' + val1 + '去' +val2);
    }
};
var db = {
    name: '小米',
    age: 40
};
obj.goFun.call(db,'成都','上海'); //我是小米,我40岁了,从成都去上海
obj.goFun.apply(db,['成都','上海']); //我是小米,我40岁了,从成都去上海
obj.goFun.bind(db,'成都','上海')(); //我是小米,我40岁了,从成都去上海
           

微妙的差距!

call 、bind 、 apply 这三个函数的第一个参数都是 this 的指向对象;

第二个参数差别就来了:

call 的参数是直接放进去的,第二第三第 n 个参数全都用逗号分隔;

apply 的所有参数都必须放在一个数组里面传进去;

bind 除了返回是函数以外,它 的参数和 call 一样。

当然,三者的参数不限定是 string 类型,允许是各种类型,包括函数 、 object 等等!