javascript - 在使用 JS 编译的 Kotlin 编程时，尝试在 Canvas 元素上移动圆圈时遇到问题

Question

我正在构建一个非常简单的基于 Web 的“breakout”，但在尝试让球在 Canvas 元素上移动时遇到了麻烦。我确实在 javascript 中启动并运行了游戏。事情是，我现在正试图将它移植到 Kotlin(javascript 编译)。即使在我认为必要的调整之后，球也不会移动。

我在类型方面也有问题(这就是为什么你会看到那些“*1.0”在周围)，因为我无法从 int 转换为 double，但我不会说这就是这里的问题。此外，IDE 正在显示我不熟悉的评论。我在有关错误消息的部分谈到了这一点，但消息如下:“包装到要在闭包中捕获时修改的引用对象”。

我不确定问题到底出在哪里，但到目前为止我已经尝试过: -我的“setInterval”调用的其他签名 - 重新格式化程序，以便我的代码在 main() 中，以摆脱返回和“val canvas = initializeCanvas()”调用。

import org.w3c.dom.*
import kotlin.browser.*
import kotlin.math.*


val canvas = initializeCanvas()
fun initializeCanvas(): HTMLCanvasElement {
    val canvas = document.createElement("canvas") as HTMLCanvasElement
    val ctx = canvas.getContext("2d") as CanvasRenderingContext2D
    ctx.canvas.width = 480
    ctx.canvas.height = 320
    document.body!!.appendChild(canvas)
    var x = canvas.width/2
    var y = canvas.height-30
    val dx = 2
    val dy = -2
    fun drawBall(){
        ctx.beginPath()
        ctx.arc(x*1.0, y*1.0, 10.0, 0.0, PI*2)
        ctx.fillStyle = "#000000"
        ctx.fill()
        ctx.closePath()
    }
    fun draw(){
        ctx.clearRect(0.0, 0.0, canvas.width*1.0, canvas.height*1.0)
        drawBall()
        x += dx
        y += dy
    }
    window.setInterval(draw(),10)
    return canvas
}

预期的输出是球向 Canvas 右上角移动，然后消失在墙上，因为我还没有实现碰撞。

正如我所说，当前输出是一个静态球。

至于错误信息，没有。但是一个“IDE Note”一直困扰着我。在我提供的代码中，在 draw 函数中，我增加了 x 和 y。当我将鼠标悬停在它们上面时，intellij 说它们“被包装到一个引用对象中，以便在闭包中捕获时进行修改”。我以前从未见过这样的警告，网络搜索也没有结果。

Answer 1

Wrapped into a reference object to be modified when captured in a closure

这仅意味着您必须将要执行的方法 - draw - 包装在一个闭包中。没有它只会调用一次。

所以简单的改变

window.setInterval(draw(), 10)

到

window.setInterval( { draw() }, 10)