使用 JavaScript 在 Adob​​e Animate 中意外重新分配變量

Question

我最近開始玩 Adob​​e Animate + JavaScript。 我試圖在每個滴答聲中增加一個變量。 在 Adob​​e Animate 項目中，在某個時候我在事件循環內重新分配變量時遇到了意外行為：

myVar = 0;

createjs.Ticker.addEventListener('tick', mainLoop.bind(this));

function mainLoop() {
    myVar += 1;
    this.mytext.text = myVar; // mytext is a text box pre-drawn on canvas
}

這會產生意外的增量，在文本框中看到：

如果myVar使用let或var聲明，則結果值在 1 和 2 之間波動

創建新文檔后，問題消失了。 類似的代碼也可以在 jsfiddle 中按預期工作： https ://jsfiddle.net/cdf5utmx/2/。

我不確定文檔是如何變得“混亂”的，因為同時更改的代碼之外的唯一設置是幀速率設置。

我想知道是否有人遇到過類似的問題，因為每次都創建一個新文檔是不切實際的。

我在 Windows 10、Chrome 91.0 瀏覽器上使用 Adob​​e Animate 21.0。

我習慣於使用 Python 和 JavaScript 新手，這意味着我可能不了解 JavaScript 中變量分配和作用域的一些基本知識。 這也很可能是 Adob​​e Animate 特定的問題

回答：正如Lanny指出的那樣，該問題與在多個幀而不是一個幀中運行的代碼有關

Answer 1

沒有看到更多代碼，我不確定，但看起來您可能會多次運行您的代碼。 如果您在 Anime 的框架腳本中有上面的代碼塊，那么它可以在每次框架運行時執行。 在那里拋出一個控制台登錄來確認它。 如果有多於一幀，Adobe Animate 將默認循環幀時間線。

一種典型的方法是將該代碼移到 Animate 之外，並移到它可以運行一次的主 HTML 或 JavaScript 文件中。 或者，您可以將代碼放在一個塊中以確保它只運行一次：

var runOnce = false;

if (!runOnce) {
    runOnce = true;
    var myVar = 0;
    
    createjs.Ticker.on('tick', mainLoop, this);
    
    function mainLoop() {
        myVar += 1;
        this.mytext.text = myVar; // mytext is a text box pre-drawn on canvas
    }

}

我還展示了on()的用法，它提供了一個范圍參數（ docs ）