javascript 新手, 最近在看蕭大直播編程, 第一集就有不明白的地方, 在蕭大重構(gòu)的時(shí)候, 在 GuaGame 里面對(duì) event, setInterval 進(jìn)行了一個(gè)注冊(cè)事件, 我不是很懂這個(gè)注冊(cè)事件的原理是怎樣的, 望有看過直播的人能解答一下:

沒重構(gòu)之前的代碼大概是這樣的:

window.addEventListener('keyup', function() {
    var k = event.key
    if (k == 'a') {
        leftDown = false
    }
    else if (k == 'd') {
        rightDown = false
    }
})

setInterval(function() {
    // update x
    if (leftDown) {
        x -= speed
    }
    else if (rightDown) {
        x += speed
    }
    // draw
    context.clearRect(0, 0, canvas.width, canvas.height)
    context.drawImage(img, x, y)
}, 1000/30)

我的理解是:
對(duì) KeyboardEvent 進(jìn)行監(jiān)聽, 如果是按下對(duì)應(yīng)的鍵(比如'a')就執(zhí)行 setInterval函數(shù)來移動(dòng) paddle

重構(gòu)以后這部分代碼變成了這樣:

var g = {
        actions: {},
        keydowns: {},
    }
    window.addEventListener('keydown', function(event){
        g.keydowns[event.key] = true
    })
    window.addEventListener('keyup', function(event){
        g.keydowns[event.key] = false
    })
    // 注冊(cè)事件
    g.registerAction = function(key, callback) {
        g.actions[key] = callback
    }
    // timer
    setInterval(function() {
        // events
        var actions = Object.keys(g.actions)
        for (var i = 0; i < actions.length; i++) {
            var key = actions[i]
            if (g.keydowns[key]) {
                // 如果案件被按下, 調(diào)用注冊(cè)的 actions
                g.actions[key]()
            }
        }
        // update
        g.update()
        context.clearRect(0, 0, g.canvas.width, g.canvas.height)
        // draw
        g.draw()
    }, 1000/30)

不是很理解這個(gè) actions 和 keydowns兩個(gè)對(duì)象到底是儲(chǔ)存了什么, 這段注冊(cè)事件到底是怎么一個(gè)原理.

若有人能解答, 不勝感激, 謝謝