rbudiharso Posted July 1, 2014 Share Posted July 1, 2014 Anybody ever have this problem before?, In this code:while (killedSprites.length > 0) { var sprite = killedSprites.shift(); var tween = game.add.tween(sprite); tween.to({ alpha: 0 }, 100, Phaser.Easing.Linear.None); tween.onComplete.add(function () { sprite.destroy(); }); tween.start();}Why is it that when killedSprite has more than 1 sprites, only the first sprite gets detroyed even if the tweens are all run and complete. Link to comment Share on other sites More sharing options...
lewster32 Posted July 1, 2014 Share Posted July 1, 2014 Because the 'sprite' var can only refer to one sprite and is accessible in this context by all of the tweens (rather than there being a different sprite reference for each complete event) so when all of the tweens finish, they're all trying to destroy the same sprite. You could probably fix the problem by doing it this way:killedSprites.forEach(function(sprite) { var tween = game.add.tween(sprite); tween.to({ alpha: 0 }, 100, Phaser.Easing.Linear.None); tween.onComplete.add(function () { sprite.destroy(); }); tween.start();});// now we've done everything we need to do with the array, we can just blank itkilledSprites = [];Now because you're using an anonymous function to perform each action, every tween has its own unique sprite reference to destroy. We can then just discard the whole array after doing it, rather than pick them off one by one. rbudiharso and hoskope 2 Link to comment Share on other sites More sharing options...
rbudiharso Posted July 1, 2014 Author Share Posted July 1, 2014 Right, I thought because the code is in a loop, the variable would be uniquely bound to each tween, I guess that's not the case. Anyway, I've implemented your code and no surprise it works! Thanks Link to comment Share on other sites More sharing options...
lewster32 Posted July 1, 2014 Share Posted July 1, 2014 Unfortunately not - loops are not a context in JavaScript, but functions are. It's a common issue and not entirely easy to spot or work out if you're not aware of how context works! When you're declaring your sprite var, you're doing it in the context of the whole function and any functions within it, so it's reused each time the while loop repeats. To avoid this you need to ensure you encapsulate your variables by declaring them inside the function that the action is performed in. Tricky stuff! Link to comment Share on other sites More sharing options...
rbudiharso Posted July 2, 2014 Author Share Posted July 2, 2014 Yup, it javascript 101 about closure, this code also works, tl;dr one can use IIFE for this to works while (killedSprites.length > 0) { var sprite = killedSprites.shift(); (function (_sprite) { var tween = game.add.tween(_sprite); tween.to({ alpha: 0 }, 100, Phaser.Easing.Linear.None); tween.onComplete.add(function () { _sprite.destroy(); }); tween.start(); })(sprite);} hoskope 1 Link to comment Share on other sites More sharing options...
lewster32 Posted July 2, 2014 Share Posted July 2, 2014 Yeah that's a really nice advanced way of doing it - a little bit of a mind bender for anyone not really comfortable with JavaScript though Link to comment Share on other sites More sharing options...
Recommended Posts