TweenJS不尊重实例？

Question

情况

我需要循环遍历一个数组，并根据每个项的值运行一个临时值。因此，对于数组中的每个项，必须有一个单独的Tween实例。根据TweenJS文档，get()方法“返回一个新的吐温实例”。

问题

对于for循环中的数组中的每个项，似乎只有一个实例在运行一个新的吐温。

代码

HTML

<div id='log'></div>

Javascript

var items = [3,6,2,8,9,6];
var log = document.getElementById('log');

for(var i = 0; i < items.length; i++){
    var item = items[i];

    var start = {
        x: item * 10,
        y: item * 15
    };

    var end = {
        x: item * 10,
        y: item * 30
    };

    createjs.Tween
        .get(start, {
            onChange: function () {
                log.innerHTML = log.innerHTML + i + " - " +  JSON.stringify(start) + "<br/>";
            }
        })
        .to(end, 1000)
};

The Demo

http://codepen.io/anon/pen/pilAL -注意输出。开头的数字是当前数组值的索引。它只显示最后一项。

理想.

理想情况下，数组中的每一项将在其值之间分开。

，提前谢谢！

Answer 1

快速和肮脏的解决方案是在onChange中使用"event“参数，并检查它的target.target属性。

诀窍是，它正确地触发了所有的东西，但是变量范围是这样的，以至于I和start不再包含您在事件方法触发时所寻找的值。

下面就是这个变化：http://codepen.io/anon/pen/FhsHz

是的，正如我所预料的，它来自一个词汇范围的问题.我不得不重新振作起来，因为我已经有一段时间不得不以这样的方式处理Javascript了(因此我担心它！)

阅读本指南，它非常有洞察力，并开始在“创建循环中的闭包”小节中讨论您的问题和解决该问题的方法：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Closures

要点是，如果您希望创建的匿名函数使用在创建该函数时捕获的值，则必须将您最终使用的变量的作用域设置为这样一个状态，即它实际上指向了所需的值。

这很烦人，它们确实应该为您提供一个比"event.target.target“更直观的参数，作为获取您所寻求的值的地方，但是替代方法是做一些类似于它们在本例中所做的事情，并在本质上创建一个函数生成函数，将变量传递到其中。此时，函数使用的变量的作用域将成为“生成函数”中传入的参数的作用域，并且它将指向适当的值。是的。