如何迭代对象中的对象和对象数组，并在每个对象中运行相同的函数？

Question

I have the following data structure:

const test1 = {
  hero: {
    update() {
      console.log('updated hero in object');
    },
  },
  zombies: [
    {
      update() {
        console.log('updated zombie 1 in array of objects');
      },
    },
    {
      update() {
        console.log('updated zombie 2 in array of objects');
      },
    },
  ],
};

I can manually run the functions with:

test1.hero.update()
test1.zombies[0].update()
test1.zombies[1].update()

But there will be hundreds of zombies, and other arrays and single objects.

Do I need recursion to run them all, or maybe filter or reduce could be used? I have the following code snippet, but I can't seem to make it run the functions. The fact the KEY is update and the VALUE is update() is throwing me somehow!

I did cheat before and just put the hero in an array by itself and then it is easy using Object.keys and 2x nested forEach s, but it seems a weak solution

// Code shows keys and values of everything, but can't run update()
const iterate = obj => {
  Object.keys(obj).forEach(key => {
    console.log(`KEY: ${key}, VALUE: ${obj[key]}`);
    if (typeof obj[key] === 'object') {
      iterate(obj[key]);
    }
  });
};

iterate(test1);

Answer 1

You can use Array.prototype.flatMap to achieve this. Here is an example:

 const test1 = { hero: { update() { console.log('updated hero in object'); }, }, zombies: [ { update() { console.log('updated zombie 1 in array of objects'); }, }, { update() { console.log('updated zombie 2 in array of objects'); }, }, ], }; Array.prototype.flatMap = function (lambda) { return Array.prototype.concat.apply([], this.map(lambda)); }; const caller = (data) => { Object.entries(data) .flatMap((keyValueArray) => { const [key, objOrArrayValue] = keyValueArray; if (objOrArrayValue instanceof Array) { return objOrArrayValue; } return [objOrArrayValue]; }) .forEach(obj => obj.update()); }; caller(test1); 

PS: for demostration, I obtained the flatMap implementation from here

Answer 2

This could be achieved via the updateEntityArray() function (see below) which provides a generic, recursive solution:

 const test1 = { hero: { update() { console.log('updated hero in object'); }, }, zombies: [ { update() { console.log('updated zombie 1 in array of objects'); }, }, { update() { console.log('updated zombie 2 in array of objects'); }, }, ], }; /* Generic function that recursively calls update() on items in supplied entities */ const updateEntities = (entities) => { /* Iterate values of supplied entities */ for(const entity of Object.values(entities)) { /* If this entity has an update function defined then call it */ if(typeof entity.update === 'function') { entity.update(); } /* If this entity is iterable then recursively call updateEntities where any updatable children of this entity will be up updated as well */ if(typeof entity[Symbol.iterator] === 'function') { updateEntities(entity); } } } updateEntities(test1);