Javascript方法:此&那

时间:2012-05-19 02:32:10

标签: javascript object methods this

这里的第一个问题。

我正在尝试Javascript对象。这是我的代码:

function main(){
    document.onkeydown = hero.keyListener;
    hero.move();
    hero.counter(); 
}
var hero = {
    dx: undefined,
    dy: undefined,
    keyListener: function (e) {
        this.dy = 100;
    },  
    move: function () {
        this.dx = 80;
    },
    counter: function() {
        document.getElementById("dxcounter").innerHTML = "Dx: "+ this.dx + " Dy: "+ this.dy;
    }   
};

移动方法会更新this.dx,但是当按下某个键时,keyListener不会更新this.dy

如果我像这样更改keyListener,它会起作用:

keyListener: function (e) {
    that = hero;
    that.dy = 100;
},

为什么move方法适用于this而不适用于keyListener?

2 个答案:

答案 0 :(得分:2)

在JavaScript中,this默认情况下不会绑定到对象;它是由上下文设置的。在这种情况下,this将为document。解决此问题的一种方法是绑定函数,使this始终为hero

document.onkeydown = hero.keyListener.bind(hero);

注意:bind仅适用于较新的浏览器。

答案 1 :(得分:1)

JavaScript中的this运算符并不总是遵循您期望的范围规则。

本文将帮助解释正在发生的事情:http://unschooled.org/2012/03/understanding-javascript-this/