JavaScript 中的 this, call, apply, bind...

核心提示： 恩，apply的第二个参数是数组，JavaScript 中的 this, call, apply, bind...(4)，这是call不容易做到的4, bind好，有了call和apply，也就不存在混不混了时间不早了，直接看下修改完成的代码吧0.<script>1.function

恩，apply的第二个参数是数组，这是call不容易做到的

4, bind

好，有了call和apply，现在试图来修改第一部分中的代码， 我为了避免混淆this内容，所以我要显示的在call的第一个参数里传我的this过去

看一下代码

　　　0.　<script>　　
　　　1.　function　test_handler(par){　　
　　　2.　this.par　=　par;　　
　　　3.　this.output　=　function(){　　
　　　4.　alert(this.par);　　
　　　5.　}　　
　　　6.　}　　
　　　7.　function　addHandler(){　　
　　　8.　var　obj　=　new　test_handler("my　paramters　input");　　
　　　9.　document.getElementById("button1").onclick　=　obj.output.call(obj);//this　=>　var　obj　=　new　test_handler("my　paramters　input")　　
　　10.　}　　
　　11.　window.onload　=　addHandler;　　
　　12.　</script><input　id="button1"　value="click1"　type="button">　　

问题又出现了，instance是传过去了，也可以alert出来我想要的东西了，但是我得再window load的时候加载addHandler啊，这样直接call了就导致我页面load的时候就直接执行了我的函数，直接alert信息出来了，这还不止，还有个js错误。。。

似乎到这里就联想不下去了，不知道怎么解决了。。。于是又来一个新方法bind

说简单点bind的功能就是拿一个instance绑定到一个method，那么显然这个bind生效后method内部的this也就全成了之前绑定时的那个instance了，也就不存在混不混了

时间不早了，直接看下修改完成的代码吧

　　　0.　<script>　　
　　　1.　function　test_handler(par){　　
　　　2.　this.par　=　par;　　
　　　3.　this.output　=　function(){　　
　　　4.　alert(this.par);　　
　　　5.　alert(this.id);　　
　　　6.　}　　
　　　7.　}　　
　　　8.　Function.prototype.bind　=　function(instance){　　
　　　9.　var　method_self　=　this;　　
　　10.　temp　=　function(){　　
　　11.　return　method_self.apply(instance,　arguments);　　
　　12.　};　　
　　13.　return　temp;　　
　　14.　}　　
　　15.　function　addHandler(){　　
　　16.　var　obj　=　new　test_handler("my　paramters　input");　　
　　17.　var　btn　=　document.getElementById("button1");　　
　　18.　btn.onclick　=　obj.output.bind(obj);　//my　paramters　input;　undefined　　
　　19.　//btn.onclick　=　obj.output.bind(btn);　//undefined;　button1　　
　　20.　}　　
　　21.　window.onload　=　addHandler;　　
　　22.　</script><input　id="button1"　value="click1"　type="button">　　

注意看下上面代码中的注释为分别2种情况下的2次alert结果，完全符合意料，通过bind我们简单实现了显示传递instance