函数绑定:在特定的 this 环境中,以指定参数调用另一个函数。常常与回调函数和事件处理程序一起使用一遍在将函数作为变量传递的同时保留代码执行环境。

1
2
3
4
5
6
7
8
var handler = {
name: "阿清",
sayName: function(event) {
alert(this.name);
}
};
var btn = document.getElementById("btn");
btn.addEventListener("click", handler.sayName, false) //undefiend

结果显示的是undefiend,这是因为没有保存handler .sayName() 的环境,所以 this 指向DOM按钮而非handler(在IE8中 this 指向window)。


解决方法:
ES5为所有的函数定义一个原生的 bind() 方法。

1
2
3
4
5
6
7
8
var handler = {
name: "阿清",
sayName: function(event) {
alert(this.name + ":" + event.type);
}
};
var btn = document.getElementById("btn");
btn.addEventListener("click", handler.sayName.bind(handler), false) //阿清:click

bind函数接收一个参数:一个环境。在给定的环境中调用函数。

只要是将某个函数指针以值的形式进行传递,同时该函数必须在特定环境中执行,被绑定函数的效用就突显出来了。它们主要用于事件处理程序以及setTimeout() 和setInterval()。 然而,被绑定函数与普通函数相比有更多的开销,它们需要更多内存,同时也因为多重函数调用稍微慢一点,所以最好只在必要时使用。




愿你的坚持终有收获。