JavaScript[Konva]: 仅排列多个事件 return 最后一个对象

Question

当多个Transformer对象存储在数组中时，on()事件仅returns最后一个对象transAry(transAry[transAry.length-1]).

for (var i = 0; i < transAry.length; i++){
  var trans = transAry[i];
  trans.on('transformer dragmove', function(){
    console.log(trans.x(), trans.y(), trans.scaleX(), trans.scaleY());
  });
}

在这种情况下，当通过鼠标操作移动或调整每个 Transformer 对象时，console.log 仅显示 transAry(transAry[transAry.length-1]) 的最后一个对象。

我想触发数组Transformer对象的所有事件，但我不知道该怎么做。

好像不是Konva.js特有的问题，但我猜是因为我不明白JavaScript异步处理是如何正常工作的.

Answer 1

我认为，当你使用 var 时，on() 是一个回调函数，所以当 on() 运行时，for 循环结束并且变量 trans = 数组中的最后一个元素 => console.log 总是 return 数组中的最后一个元素

我想解决这个问题，你可以使用 let 而不是 var

Answer 2

for (var i = 0; i < transAry.length; i++){
  (function(cnt){
    var trans = transAry[cnt];
    trans.on('transformer dragmove', function(){
      console.log(trans.x(), trans.y(), trans.scaleX(), trans.scaleY());
    });
  })(i);
}

这是给自己的备忘录。事实证明，将回调函数限制在立即函数内也可以达到同样的效果。 cnt 的范围仅限于立即函数。

JavaScript[Konva]: 仅排列多个事件 return 最后一个对象

JavaScript[Konva]: arrayed multiple events only return the last object

javascript

arrays

events

konvajs