JavaScript - Map through an array and return another array

Question

I have this simple function, that returns an array based on a condition:

const operationPerResource = (resource: ResourceTypes): OperationTypes[] => {
  const operations = cases[resource] || cases.default;
  return operations;
};

And I want to use that Function to iterate over an Array of Object with a {labe: string, value: string} type.

So, I create a simple map:

    const resources = transformEnumToArray(ResourceTypes);

    const operations = operationPerResource(resources[0].value).map((value: any) => ({
      label: value,
      value
    }));

The above function gives the results only for the first item in the array. I want to iterate over all the items of the Array resources in our case, and depending on which one I choose, I get back the available operations.

THE PROBLEM: I have a select-box. Each select-box is populated by resources. Every time, I select a resource, I want to print the correct output. So, I used the operationPerResource function to return the available operations for each resource:

But, the resources are an Array of Objects, so, I need to iterate over them, in order to get back the correct Operations every time:

exmaple:
  Resource: Name1 => Operations for Name1[3 Items]
  Resource: Name2 => Operations for Name2[2 Items]
  Resource: Name3 => Operations for Name3[5 Items]

And so on and so on. If I click on a specific resoure I get back the expected results each time. I just want to make it dynamic..

I only want to print the results of each resource not all of the results together.

I am kinda stuck here. Any help will be appreciated.

I'm having difficulties understanding what you want to do. Do you just need to call map on each element of resources[0].value transfoerm by operationPerResource? Is that what you need? — briosheje
– briosheje, Commented Aug 12, 2019 at 15:28
I want to iterate over the list. And the operationPerResource will return the correct array, each time. Basically, I want to iterate, to find the correct value. — user10104341
– user10104341, Commented Aug 12, 2019 at 15:33
@DimitrisEfst I'm slightly more confused than I previously was. Mind giving an input and output example? — briosheje
– briosheje, Commented Aug 12, 2019 at 15:35
I updated the descriptions as best as I could. Sorry if I confused you. — user10104341
– user10104341, Commented Aug 12, 2019 at 15:40

charlietfl · Accepted Answer · 2019-08-12 15:32:20Z

1

I think what you want is to map resources array with a nested map() of array returned from operationPerResource()

const operations = resources.map((r) => {
  return operationPerResource(r.value).map((value: any) => ({
      label: value,
      value
    })
  })
})

answered Aug 12, 2019 at 15:32

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Justin Collins · Accepted Answer · 2019-08-12 15:42:32Z

0

It seems like you want to iterate over all the resource types then aggregate all the mapping results from each of those. As a result you essentially are creating an array of arrays. You can flatten these following logic similar to:

const resourceTypes = transformEnumToArray(ResourceTypes);

const operations = [];

resourceTypes.forEach(resourceType => {
    const operationsForResource = operationsPerResource(resourceType.value);
    Array.prototype.push.apply(operations, operationsForResource.map((value: any) => ({
        label: value,
        value
    })));
});

operations will then contain all of the map results aggregated in one array.

answered Aug 12, 2019 at 15:42

Justin Collins

3502 silver badges7 bronze badges

Collectives™ on Stack Overflow

JavaScript - Map through an array and return another array

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related