bind()使用方法

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();//29
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，绑定要回调函数方便继续使用实例

function Fun1() { this.name = 1;}
Fun1.prototype.fun2 = function() {window.setTimeout(this.fun3.bind(this), 1000);}
Fun1.prototype.fun3 = function(){console.log('name:'+this.name);//name:1
}
var fun = new Fun1();
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]

bind()使用方法相关推荐

callee、caller、call、apply、bind这些方法的含义和使用
在学校时间比较充裕,所以利用这段时间好好回顾下了js的基础.这回说下这五个函数属性方法,它们分别是:callee.caller.call.apply.bind 这5个方法在刚学js的时候一直理解不透, ...
js apply/call/caller/callee/bind使用方法与区别分析
一.call 方法调用一个对象的一个方法,以另一个对象替换当前对象(其实就是更改对象的内部指针,即改变对象的this指向的内容). Js代码 call([thisObj[,arg1[, arg2[, ...
js call,apply,bind三个方法的区别
相同点: 都是能够改变this的指向不同点: 1.call():传参方式跟bind一样(都是以逗号隔开的传参方式),但是跟apply(以数组的形式传参)不一样, 2.bind(): 此方法应用后的情 ...
vue 多层子组件调用父组件的方法（传参方式bind方法或注入 provide() {}方法）
一,传参方式bind的方法的使用例: 1.ui作为一个对象 data() {return {ui:{}//ui作为一个对象} } 2.初始化中,给ui绑定一个方法editDesignTree,使用b ...
c++11 bind直接绑定未初始化类的成员函数、类对象的operater()的方法与区别
针对标题的两种情况,使用起来有一定的特殊性,特此记录下. 至于其他常规的bind使用方法,网上有很多文章有介绍,也可以看这篇文章. 标题的两种情况: 情况一: 这个例子用了两个知识: 第一,关于std ...
JavaScript中的call、apply、bind深入理解
一.函数的三种角色首先要先了解在函数本身会有一些自己的属性,比如: length:形参的个数: name:函数名: prototype:类的原型,在原型上定义的方法都是当前这个类的实例的公有方法: ...
future.channel().closeFuture().sync()作用 bind(port).sync()作用
一. 实例例子1 public class NettyServer {public static void main(String[] args) throws InterruptedExcepti ...
object取值_this的原理、函数的不同调用方式this取值、以及不同环境下this的取值、函数四种调用方法...
一.this的原理 1.1问题的由来学懂 JavaScript 语言,一个标志就是理解下面两种写法,可能有不一样的结果 var obj = {foo: function () {} };var fo ...
学习bind源代码，比较bind的方式绑定函数在在内存使用上优于箭头函数
前言使用ES的class,到底是使用箭头函数更有效率,还是在构造器函数(constructor)中使用bind函数给函数绑定context更加有效率?在Demystifying Memory Usa ...

bind()使用方法

bind()使用方法相关推荐

最新文章

热门文章