Destroy sprite inside forEachAlive generates undefined error

[mary]

Hello. I'm trying to destroy some sprites that belong to a group by looping using the forEachAlive method.

 

Has anyone encountered a this.children is undefined error when trying to destroy a sprite that belongs to a group?

 

Using box.kill() doesn't generate the error, but I thought destroy is better if you're not going to use the sprite anymore because it frees up resources.

 

If I thought wrong, feel free to correct my understanding of destroy vs kill. Thanks!

document.getElementById("textinator").onkeydown = function(pressed) {    textinator = this;    typedAnswer = this.value;    correct = false;    if (pressed.keyCode == 13) {        boxes.forEachAlive(function(box) {            if (box.answer == typedAnswer) {                correct = true;                box.destroy();                //box.kill();            }        });    }        if (correct) {        textinator.value = "";    }    else {    }}

[lewster32]

I think this may be because of the fact that you're using a DOM event to destroy the object, potentially destroying it at a strange place in the frame execution order. Basically, Phaser does lots of things each frame, and expects things to happen in a specific way - which when you start adding things which aren't controlled by the regular ticking of Phaser's frame timer, can cause problems such as this. You may be better off killing the objects, and then having something like this in the update loop to clean them up:

function update() {  boxes.forEachDead(function(box) {    box.destroy();  });}

Though I would go so far as to say that in most cases, you probably don't want to be destroying anything in this kind of situation. You'd be far better off with an object pool (see this example) that you can kill and revive at your leisure, then not have to worry about cleaning up.

[Heppell08]

It really makes no difference on resources because its loading that really matters. If you have a predefined number of sprites within a group and want to destroy you need to remove from the group then destroy it.

if killing it works and doesn't effect any gameplay or runtime lags (which it shouldn't anyway) then stick with killing it and forget it existed after its killed.

[mary]

 

 

I think this may be because of the fact that you're using a DOM event to destroy the object, potentially destroying it at a strange place in the frame execution order.

@lewster32, does this still hold true if my code is inside the create function? 

 

But I think I'll take both your advice and Heppell08's to just kill and revive the boxes instead of destroying each one. I see that this method is much easier since I won't have to redefine the box's properties.

 

Thanks for the explanation!

[lewster32]

It's not so much where it's defined but when it's triggered. If you use Phaser's pointer/keyboard stuff, I believe they poll the inputs to ensure that any callbacks happen at the right point in the execution order. If however you're listening for an event on the DOM (or indeed anything not tied to Phaser's internal clock) the callback could literally happen at any point, and thus end up breaking stuff.

 

If you really need to use non-Phaser timings, the best thing to do is mark those actions as pending with a flag on the objects in question, then defer the action itself to something in the update loop. That way you can be sure that your action will take effect at the soonest possible time after triggering, but also at the right stage in the execution order.