函数绑定

var handler = {

message: "哈哈",
handleClick: function(event){
alert(this.message);
}

};
document.body.addEventListener("click", handler.handleClick, false);    //点击的时候返回undefined而不是 "哈哈"，因为this指向的是document.body，而这个对象没有message属性
因为handler.handleClick()的上下文环境没有被保存

 

改成下面就可以返回：
document.body.addEventListener("click", function(event) {
    handler.handleClick(event);
}, false);
用闭包的方式调用handler.handleClick(event);就能保留对应上下文了

 

 

很多框架都有一个方法叫做bind()，就是为了解决这个问题，保留特定的上下文环境
function bind(fn, context){

return function(){
     return fn.apply(context, arguments);
};

}
注意这里传进的arguments是内部函数的，而不是bind的。

 

 

ECMAScript 5 引入了原生的bind方法：
var handler = {
message: “Event handled”,
handleClick: function(event){
alert(this.message + “:” + event.type);
}
};
var btn = document.getElementById(“my-btn”);
EventUtil.addHandler(btn, “click”, handler.handleClick.bind(handler));

 

绑定函数通常用于event handle和setTimeout等，但是会有更多消耗，因为需要更多的内存和更多的函数调用，必要的时候才用。