0

我无法解决范围问题。实际上，我正在开发一个 HMI 浏览器前端的项目。它应该可视化来自自动化系统的变量。对于 HMI，它要求用户可以在不同的页面之间切换。为了解决一般流程，我创建了一个状态机函数，它协调加载、绘图和与用户的交互。我现在的问题是我使用 setTimeout 来调用 run 函数（这实际上是我的状态机）并且现在在 var-scope 上运行时遇到了麻烦。

看下面的代码：

function frontend() {

  // Public properties:
  this.soundEnable = true;

  // Private Properties:
  var p1 = 0;
  var p2 = [1,2,3];
  var p3 = {a:1, b:2, c:3};
  var runState = 1;
  var runWait = false:

  // Public Methods

  // stops the state machine until m_continue is called
  this.m_wait = function() {
    runWait = true;
  }

  // continues the state machine
  this.m_continue = function() {
    if (runWait) {
      runWait = false;
      setTimeout(run, 100);
    }
  }

  // Private Methods

  function drawFrame(finish_callback) {
    ...<Drawing of HMI-Objects on the canvas>...
    finish_callback();
  }

  function run() {
    switch (runState) {
    case 1:
      this.m_stop();
      drawFrame(this.m_continue());
    case 2:
      for(i=0; i<p3.length; i++) {
        p2.push(externalObjectCreator(p3[i]));
      }
    }
    if (!runWait) {
      runState++;
      setTimeout(run, 100);
    }
  }

  // Constructor
  ...<code to assign public and private properties>...

  // Finally call the state machine to activate the frontend
  runState = 1;
  run();
}

问题是运行函数的范围。如果从构造函数末尾第一次调用，一切正常。run 可以访问所有私有属性并对其进行操作。但是，当稍后通过 m_continue 的 setTimeout 或它本身调用它时，我无法访问私有属性。在萤火虫中，我只能看到公共属性和功能，而没有我需要的私有属性。

使用全局变量会有所帮助，但这是不可能的，因为在多监视器解决方案中，我有 2 个单独的画布对象，它们需要显示 HMI 的单独版本——在这种情况下，我需要在一个浏览器窗口中并行运行 2 个前端实例。

有谁知道该问题的解决方案？我在我的知识的尽头，完全糊涂了。

4

2 回答 2

1

最简单的方法是定义您的范围。许多知名的 javascript 库也使用这种技术。

this.m_continue = function() {
 that = this;  
 if (runWait) {
      runWait = false;
      setTimeout(that.run, 100);
    }
  }

否则，您也可以使用范围绑定apply

于 2013-01-02T09:56:53.670 回答
0

您应该在每个 setTimeout 中绑定 run 函数，因为 run 使用this. 

setTimeout(run.bind(this), 100);
于 2013-01-02T10:24:17.083 回答