如何在不使用全局变量的情况下从回调中获取数据？

正如Nik020指出的，您可以使用闭包。立即调用的函数表达式（IIFE）会创建一个闭包，但不必是IIFE模式。普通的命名函数会做同样的事情

function main() { 
    var translation = 0;

    function main() {
        // load images

        loopClosure(images);
    }

    function loopClosure(images) {
        // setup webgl

        function render() {
            window.requestAnimationFrame(render);

            // use translation here to update image locations
        }

        render();
    }

    document.addEventListener('keydown', keyboardHandler, false);

    function keyboardHandler(event) {
        if (event.key == 'ArrowLeft') {
            translation--;
        }
        if (event.key == 'ArrowRight') {
            translation++;
        }
    }
}

main();

IIFE模式仅表示您不必考虑名称，并且该名称不会与其他名称冲突。

您也可以绑定this。例

class App {
  constructor() {
    this.translation = 0;
    document.addEventListener('keydown', this.keyboardHandler.bind(this), false);
  }
  keyboardHandler(event) {
    if (event.key == 'ArrowLeft') {
        this.translation--;
    }
    if (event.key == 'ArrowRight') {
        this.translation++;
    }
  }
}

const app = new App();

您使用箭头语法（绑定时使用语法糖） this

class App {
  constructor() {
    this.translation = 0;
    document.addEventListener('keydown', (event) => {
      if (event.key == 'ArrowLeft') {
          this.translation--;
      }
      if (event.key == 'ArrowRight') {
          this.translation++;
      }
    }, false);
  }
}

const app = new App();

如果您希望能够删除侦听器，并且正在使用箭头函数或绑定，则可以将函数引用存储在变量中

class App {
  constructor() {
    this.translation = 0;
    const keyboardHandler = (event) => {
      if (event.key == 'ArrowLeft') {
          this.translation--;
      }
      if (event.key == 'ArrowRight') {
          this.translation++;
      }
    };
    document.addEventListener('keydown', keyboardHandler, false);
  }
}

const app = new App();

还有4到10种方法来绑定此和/或进行关闭。