[SOLVED] Coding: entity.children.forEach( element => element.destroy()) doesent work

Help & Support
1 
BuildPath.prototype.resetPathButtons = function () {

  pathButs = DozerLeft.findByName('buttonsPossiblePath').children;

  console.log('new destroy', pathButs.length);  

  pathButs.forEach( but => {

      if (!but.name.includes('Def')){

        but.destroy();}

    });

    pathButs = DozerRight.findByName('buttonsPossiblePath').children;

    pathButs.forEach( but => {

      if (!but.name.includes('Def')){ but.destroy();}

    });

    DozerLeft.findByName('buttonsPossiblePath').children.forEach(leftBut => console.log(leftBut.name));

    console.log('after destroy', pathButs.length);

    if ( DozerLeft.findByName('buttonsPossiblePath').children.length > 4){ this.resetPathButtons();}

};

solved the Issue with a recursive call ā€¦ but i hate that :slight_smile: ā€¦
what I`ve done wrong?

as You see Iā€™ve log the result for every callā€¦ the last child will never get destroyed?
Depending on the random map the possible way points can rise to about a hundret, that still ok for performance, but I`d like to reduce quick fixes in my code, learn what I did wrong and doesent have any recursive , likely possible dangerous code in my codeā€¦

if(help) { graditude( ā€˜thanxā€™);}

PS: The Buttons starting with ā€˜Defā€™ are default Buttons Iā€™ll need in the next fuction call.

> if ( DozerLeft.findByName('buttonsPossiblePath').children.length > 4){ this.resetPathButtons();}

there are 4 Def Buttons DefLeft , DefRight , DefUp and DefDownā€¦

project: PlayCanvas | HTML5 Game Engine
editor: PlayCanvas | HTML5 Game Engine

theres a much bigger issue: involving gamePad/controller Id like to delay that isssue, still prototype is basically workingā€¦ :smiley:

pps: the PathButton script doesnā€™t exist right now, but it will have element.on (thouch and mouse event)
any suggesetions how to handle that are verry welcomeā€¦
I belive Iā€™m, still prototyping and have lots of unkilled event handlers :frowning:

2

This is because as you destroy children, the size of the array of children (pathButs in your case) changes as well so the foreach loop is missing every other child.

For something like this where the array can decrease in size while looping through it, the recommended practise is to loop backwards.

eg

        var children = this.entity.children;
       
        for (var i = children.length - 1; i >= 0; --i) {
            if (!children[i].name.includes('Def')) {
                children[i].destroy();
            }          
        }
1 Like
3

For these issues, please have separate threads

1 Like
4

Pop() instead of shift() understood :smiley:

5

Maybe? Depends on the context of the code

1 Like
6

The array of children should not be directly modified unless itā€™s a copy of the array from the entity

1 Like
7

I got the message ā€œgo backwardā€
I only thought forEach(()=>{})
performance much better ā€¦
LINT always tells me to avoide ā€œforā€ but use forIn, forEach, forOut a.s.o.

sorry :cucumber:

8

They are more or less the same performance Performance of JavaScript .forEach, .map and .reduce vs for and for..of

foreach would have been fine if the array size didnā€™t change size while iterating through it.

foreach is just seen as a modern way and ā€˜cleanerā€™ to loop for an array of objects. Thereā€™s less code and duplication of code.

1 Like
9

solved