bind()测试
<div style='font-weight:bold;color:#9d9d9d'>bind()方法会创建一个新的函数,称为绑定函数,fun方法在this环境下调用</div> <div id='divid' style='font-weight:bold;color:#9d9d9d'></div> <script> var divid = document.getElementById('divid'); function showMsg(msg){ divid .innerHTML = divid .innerHTML + '<br>'+msg; } function fun1() { var slice = Array.prototype.slice; return slice.apply(arguments); } showMsg('bind()快捷使用一'); showMsg(fun1(1,2,3));//[1,2,3] function fun2() { var unboundSlice = Array.prototype.slice; // 把函数的call方法绑定在数组slice方法上,之后再给call方法传递参数 var slice = Function.prototype.call.bind(unboundSlice); return slice(arguments); } showMsg('bind()快捷使用二'); showMsg(fun2(1,2,3));//[1,2,3] function list(){ // 让类数组arguments拥有数组的方法slice,这个函数实现了简单把类数组转换成数组 return Array.prototype.slice.call(arguments); } //给list绑定一个预设参数4 var list1 = list.bind(undefined,4); showMsg('bind()预设参数'); showMsg(list1(1,2,3));//[4,1,2,3] showMsg('bind()对象转换...'); this.num = 9; var module = { num: 81, getNum: function() { return showMsg(this.num); } }; module.getNum(); // 81 var getNum = module.getNum; getNum(); // 9, 因为在这个例子中,'this'指向全局对象 // 创建一个'this'绑定到module的函数 var boundGetNum = getNum.bind(module); boundGetNum(); // 81 showMsg('bind()对象转换结束!!!'); showMsg('调用setTimeout的时候this会指向全局对象,但是使用类的方法时我们需要指向类的实例,所以要把this,绑定要回调函数方便继续使用实例'); function FunTime() { this.name = 1; } FunTime.prototype.fun2 = function() { window.setTimeout(this.fun3.bind(this), 1000); } FunTime.prototype.fun3 = function(){ showMsg('name:'+this.name);//name:1 } var fun = new FunTime(); fun.fun2(); </script>