ES6析构(不确定是否与重组有关)



所以我关注本教程,我会遇到一个奇怪的错误。

let isDrawing = false
let lastX = 0
let lastY = 0
const draw = function(ev){
    console.log('isDrawing', isDrawing)
    if(!isDrawing){
        return
    }
    ctx.beginPath()
    ctx.moveTo(lastX, lastY)
    ctx.lineTo(ev.offsetX, ev.offsetY)
    ctx.stroke()
    //[TODO] destruction doesn't work????
    [lastX, lastY] = [ev.offsetX, ev.offsetY]
    // lastX = ev.offsetX
    // lastY = ev.offsetY
}
canvas.addEventListener('mousemove', draw)
canvas.addEventListener('mousedown', (ev) => {
  isDrawing = true
  [lastX, lastY] = [ev.offsetX, ev.offsetY]
})
canvas.addEventListener('mouseup', () => isDrawing = false)
canvas.addEventListener('mouseout', () => isDrawing = false)

在绘制函数的末尾,如果我使用破坏语法,我会发现一个错误:

script.js:26未定义的typeerror:无法设置属性'0' 在htmlcanvaselement.draw

奇怪的是,当我在Mousedown事件侦听器中使用相同的符号时,它毫无问题。

我在做什么错?

您没有使用半olon,并且通过使用开放式括号开始线路就陷入了ASI陷阱。被解析为

ctx.stroke()[(lastX, lastY)] = [ev.offsetX, ev.offsetY]

最新更新