Question

我刚开始使用HTML5 canvas，但我遇到了一个我从未见过的问题。

假设我有以下代码（假设现有canvas和context变量）：

function test() {
    context.fillStyle='red';
    context.fillRect(0, 0, 40, 40);
}
test();
function test() {
    context.fillStyle='green';
    context.fillRect(0, 40, 40, 40);
}
test();

我发现两者矩形将是第二种颜色，实际位置也是错误的。

如果我将第二个函数名称更改为其他名称并改为调用它：

function test() {
    context.fillStyle='red';
    context.fillRect(0, 0, 40, 40);
}
test();
function test2() {
    context.fillStyle='green';
    context.fillRect(0, 40, 40, 40);
}
test2();

...然后按预期工作。这表明绘图函数必须是异步的，因此test()的第二个版本开始干扰第一个版本。

问题是：

这是对正在发生的事情的正确解释吗？
除了重命名功能之外，我该怎么办才能同步运行第一个例子？

由于

JavaScript Canvas：异步调用的函数？

0 个答案: