javascript 尽管已定义，但变量仍未定义

Question

我正在尝试使用此函数获取鼠标在 HTML5 canvas 上的位置：

function getMousePos(canvas, evt) {
    var rect = canvas.getBoundingClientRect();
    return {
        x: evt.clientX - rect.left,
        y: evt.clientY - rect.top
    };
}

该函数是通过附加到 window DOM 对象的事件侦听器（侦听 mousemove 事件）调用的。

我在对象中将 mousePos 的初始值声明为 0,0，如下所示：

var engine = {
    canvas: document.getElementById('main'),
    mousePos: {x:0,y:0},
    ...
}

每当我将鼠标移出 canvas 并重新加载页面时，控制台都会报告：

Uncaught ReferenceError: mousePos is not defined

由于 window.mousemove 事件尚未触发，因此变量未定义。但对我来说，似乎在我第一次使用该变量之前，它已被正确定义。尽管如此，为什么我仍然收到此错误？

我的其余代码（包括HTML）：https://pastebin.com/03FZ2Q3L

提前致谢。

Answer 1

我的代码中有些地方忘记将 mousePos 变量引用为 engine.mousePos，因为我忘记它们被放置在引擎对象中。

示例：

if(typeof mousePos.x !== undefined){ ... }

应该是

if(typeof engine.mousePos.x !== undefined){ ... }

感谢大家的帮助

javascript 尽管已定义，但变量仍未定义

javascript variable undefined despite having been defined

javascript

variables

mouseevent

undefined