我们先来看一段问题代码：
<script type="text/javascript"> var person = { name:"Kevin Yang", sayHi:function(){ alert("你好，我是"+this.name); } } setTimeout(person.sayHi,5000); script>这段代码期望在访客进入页面5秒钟之后向访客打声招呼。setTimeout函数接收一个函数作为参数，并在指定的触发时刻执行这个函数。可是，当我们等了5秒钟之后，弹出的对话框显示的this.name却是undefined。
其实这个问题和上一个示例中的问题是类似的，都是因为临时变量而导致的问题。当我们执行函数的时候，如果函数带有参数，那么这个时候Javascript引擎会创建一个临时变量，并将传入的参数复制（注意，Javascript里面都是值传递的，没有引用传递的概念）给此临时变量。也就是说，整个过程就跟上面我们定义了一个getCookie的临时变量，再将Utility.getCookie赋值给这个临时变量一样。只不过在这个示例中，容易忽视临时变量导致的bug。
函数对象传参对于函数作为参数传递导致的this指针丢失的问题，目前很多框架都已经有方法解决了。
Prototype的解决方案——传参之前使用bind方法将函数封装起来，并返回封装后的对象
<script type="text/javascript"> var person = { name:"Kevin Yang", sayHi:function(){ alert("你好，我是"+this.name); } } var boundFunc = person.sayHi.bind(person,person.sayHi); setTimeout(boundFunc,5000); script>bind方法的实现其实是用到了Javascript又一个高级特性——闭包。我们来看一下源代码：
function bind(){ if (arguments.length < 2 && arguments[0] === undefined) return this; var __method = this, args = $A(arguments), object = args.shift(); return function(){ return __method.apply(object, args.concat($A(arguments))); } }首先将this指针存入函数内部临时变量，然后在返回的函数对象中引用此临时变量从而形成闭包。
微软的Ajax库提供的方案——构建委托对象
<script type="text/javascript"> var person = { name:"Kevin Yang", sayHi:function(){ alert("你好，我是"+this.name); } } var boundFunc = Function.createDelegate(person,person.sayHi); setTimeout(boundFunc,5000); script>其实本质上和prototype的方式是一样的。
著名的Extjs库的解决方案采用的手法和微软是一样的。
您可能感兴趣的文章: