javascript中call()、apply()、bind()的用法

1、首先看下下面的例子：

例1:

var name='张三' ,age=18;
var obj={
	name: '李四'，
	objAge:this.age,
	myFun: function({
		console. log( this.name +"年龄"+this.age );
	}
}

  obj.objAge;  //18
  obj.myFun()  //李四年龄undefined

在对象里面，如果是函数里面的this，那么谁调用指向谁，如果不是在函数里面的，那么this指向的是window。

例2

var name='热巴';
function shows ( ){
	console.log (this.name ) ;
}

　shows()  //热巴　

比较一下这两者this 的差别，第一个打印里面的this 指向obj，第二个全局声明的shows()函数 this 是window ；

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

如：

var name='张三' ,age=18;
var obj={
	name: '李四",
	objAge:this.age,
	myFun: function(){
		console. log( this.name + "年龄" +this.age );
	}
}
var name2={
	name: '热巴",
	age: 19
}

结果：

　   obj.myFun.call(name2)；　　　　//热巴年龄19
 　  obj.myFun.apply(name2);　　　 //热巴年龄19
 　  obj.myFun.bind(name2)();　　　//热巴年龄19

小贴士
以上的bind 方法后面多了个 () 外 ，其他返回结果都一致。由此得出结论，bind 返回的是一个新的函数，必须调用它才会被执行。

3、对比call 、bind 、 apply 传参情况下有什么不同呢？
直接通过代码研究一下：

var name='张三',age=18;

var obj={
	name: '李四',
	objAge:this.age,
	myFun: function(a,b){
		console.log( this.name + ”年龄" + this.age ,"从"+ a+"去往"+ b );
	}
}

var name2={
	name:'热巴'，
	age:19
}

　　obj.myFun.call(name2,'广州','深圳')；　　　//热巴 年龄 19  从 广州去往深圳
　　obj.myFun.apply(name2,['广州','深圳']);        //热巴 年龄 19  从广州去往深圳
　　obj.myFun.bind(name2,'广州','深圳')();         //热巴 年龄 19  从广州去往深圳
　    obj.myFun.bind(name2,['广州','深圳'])();　　 //热巴 年龄 19  从广州,深圳去往undefined

注意事项
从上面四个结果不难看出：

• call 、bind 、 apply 这三个函数的第一个参数都是 this 的指向对象，第二个参数就有明显的差别。
• call的参数是直接放进去的，第2…n个参数全都用逗号分隔，直接放到后面 obj.myFun.call(db,‘广州’, … ,‘string’ )；
• apply的所有参数都必须放在一个数组里面传进去 obj.myFun.apply(db,[‘广州’, …, ‘string’ ]);
• bind除了返回是函数以外，它的参数类型和call一样，并且如果写成数组的话，那么它会将该数组直接赋值给一个参数，后面的参数全都因没传值，输出undefined。
• 另外，这三个函数的参数类型不仅仅可以是string类型，还允许是其他各种类型，包括函数 、 object 等。

4、在vue项目中，为了提高项目的性能，防止页面刷新过多，可通过防抖函数解决过度刷新影响性能的问题，这里面就会用到apply。