我一直在阅读每篇关于JavaScript范围的文章,以便更好地理解它。我想在最后完全理解它。我目前正在阅读这篇文章:http://www.digital-web.com/articles/scope_in_javascript/我刚刚阅读了“并发症”部分(稍微超过了一半)并认为它非常有用,但还不够清楚。
它使用以下代码并考虑onclick
的{{1}}行为:
the_button
文章指出function BigComputer(answer) {
this.the_answer = answer;
this.ask_question = function () {
alert(this.the_answer);
}
}
function addhandler() {
var deep_thought = new BigComputer(42),
the_button = document.getElementById('thebutton');
the_button.onclick = deep_thought.ask_question;
}
window.onload = addhandler;
所以,如果我要正确理解,那么在脚本的对象方法的上下文中调用... an event handler[,] runs in a different context than when it’s executed as an object method.
方法是ask_question
,使{{1} }} deep_thought.ask_question
。但是当触发DOM中的事件时,调用链会更改为this
deep_thought
DOMelement.eventHandler.deep_thought.ask_question
?
答案 0 :(得分:2)
这是对的!事件处理程序中的'this'是您绑定的元素。在这种情况下,它将是the_button
。警报将“未定义”,因为the_button
没有the_answer
属性。
您可以在以下位置查看示例:http://jsfiddle.net/zG7KR/
看看这会输出什么:
this.ask_question = function () {
alert(this.the_answer);
};