bind方法,顾名思义,就是绑定的意思,到底是怎么绑定然后怎么用呢,下面就来说说我对这个方法的理解。
语法
fun.bind(this,arg1,arg2,...)
bind()方法会创建一个新的函数,称为绑定函数,fun方法在this环境下调用
该方法可传入两个参数,第一个参数作为this,第二个及以后的参数则作为函数的参数调用
实例
1.创建绑定函数
1 this.a = 1; 2 var module = { 3 a : 2, 4 getA:function() { 5 return this.a; 6 } 7 }; 8 module.getA();//2 9 10 var getA1 = module.getA; 11 // getA在外部调用,此时的this指向了全局对象 12 getA1();//1 13 14 // 再把getA1方法绑定到module环境上 15 var getA2 = getA1.bind(module); 16 getA2();
从上面的例子可以看出,为什么要创建绑定函数,就是当我们调用某些函数的时候是要在特定环境下才能调用到,所以我们就要把函数放在特定环境下,就是使用bind把函数绑定到特定的所需的环境下。
2.让函数拥有预设的参数
使用bind()方法使函数拥有预设的初始参数,这些参数会排在最前面,传给绑定函数的参数会跟在它们后面
1 function list(){ 2 // 让类数组arguments拥有数组的方法slice,这个函数实现了简单把类数组转换成数组 3 return Array.prototype.slice.call(arguments); 4 } 5 6 list(1,2,3);//[1,2,3] 7 8 //给list绑定一个预设参数4 9 var list1 = list.bind(undefined,4); 10 11 list1();//[4] 12 13 list1(1,2,3);//[4,1,2,3]
3.setTimeout的使用
正常情况下,调用setTimeout的时候this会指向全局对象,但是使用类的方法时我们需要指向类的实例,所以要把this,绑定要回调函数方便继续使用实例
1 function Fun1() { 2 this.name = 1; 3 } 4 Fun1.prototype.fun2 = function() { 5 window.setTimeout(this.fun3.bind(this), 1000); 6 } 7 Fun1.prototype.fun3 = function(){ 8 console.log('name:'+this.name);//name:1 9 } 10 var fun = new Fun1(); 11 fun.fun2();
4.快捷方法--把类数组转换成数组
第一种方法是使用apply方法
1 function fun1() { 2 var slice = Array.prototype.slice; 3 return slice.apply(arguments); 4 } 5 6 fun1(1,2,3);//[1,2,3]
第二种方法是使用call方法和bind方法一起使用
function fun2() { var unboundSlice = Array.prototype.slice; // 把函数的call方法绑定在数组slice方法上,之后再给call方法传递参数 var slice = Function.prototype.call.bind(unboundSlice); return slice(arguments); } fun2(1,2,3);//[1,2,3]