0
\$\begingroup\$

I need to optimize this javascript method because it is a bit slow, I don't want to use the flat() command, as for some reason my angular6 app does not understand the vanilla flat() command, or display some annoying warning messages.

So check the below:

  1. my original object
  2. my result object desired
  3. my slow solution (works, but is slow)

1. my original object:

  const data = [
      {
        "id": 1,
        "name": "Application",
        "groups": [
          {
            "groupName": "",
            "configurations": [
              {
                "id": 17,
                "icon": "access_time",
                "title": "Daily Order Cut-Off Time",
                "description": "Daily Order Cut-Off Time",
                "code": "daily-order-cut-off-time",
                "value": "09:35",
                "valueType": "Time",
                "configurationTypeId": 11,
                "definition": {
                  "step": "none"
                },
                "isDefault": false
              }
            ]
          }
        ]
      },
      {
        "id": 3,
        "name": "Processing",
        "groups": [
          {
            "groupName": "",
            "configurations": [
              {
                "id": 1078,
                "icon": "flash_on",
                "title": "Auto Process",
                "description": "Will process all orders that are in the same batch",
                "code": "processing-auto-process",
                "value": "0",
                "valueType": "Boolean",
                "configurationTypeId": 6,
                "definition": null,
                "isDefault": false
              },
              {
                "id": 1074,
                "icon": "subdirectory_arrow_right",
                "title": "Allow Under Picking",
                "description": "Allow under pick when processing order?",
                "code": "processing-allow-under-picks",
                "value": "0",
                "valueType": "Boolean",
                "configurationTypeId": 6,
                "definition": null,
                "isDefault": false
              }
            ]
          }
        ]
      }
    ];

2. object desired:

 [
      {
        "id": 17,
        "code": "daily-order-cut-off-time",
        "value": "09:35"
      },
      {
        "id": 1078,
        "code": "processing-auto-process",
        "value": "0"
      },
      {
        "id": 1074,
        "code": "processing-allow-under-picks",
        "value": "0"
      }
    ]

My slow solution:

const result = data.map(module => module.groups.map(configurations => configurations.configurations.map(config => ({ id: config.id, code: config.code, value: config.value })))).reduce((l,n) => l.concat(n), []).reduce((l2,n2) => l2.concat(n2),[]));
\$\endgroup\$
  • 2
    \$\begingroup\$ Is the ES6 spread operator available to you? result = [].concat(...[].concat(...data.map( d => d.groups.map( g => g.configurations.map( c => ({id:c.id, code:c.code, value:c.value})))))) \$\endgroup\$ – Oh My Goodness Mar 28 '19 at 23:33
  • \$\begingroup\$ yes it is available. \$\endgroup\$ – Roger Oliveira Mar 28 '19 at 23:50
  • \$\begingroup\$ AMAZING! YOUR CODE IS BEAUTIFUL!, please answer my question I will mark as the correct answer! \$\endgroup\$ – Roger Oliveira Mar 28 '19 at 23:55
3
\$\begingroup\$

As commented, the ES6 spread operator flattens like you want. The syntax is a little weird for multiple invocations:

result = [].concat(...[].concat(...data.map( d => d.groups.map( g => g.configurations.map( c => ({id:c.id, code:c.code, value:c.value})))))) 

The arr.flat() method does the same thing more simply. It takes an optional depth argument to indicate how many levels to descend when flattening. In your case, depth is 2.

.flat is a recent feature that may not exist on your platform. Most notably, Node 10 and MS Edge do not have it, while both of those do have the spread operator:

data.map( d => d.groups.map( g => g.configurations.map( c => ({id:c.id, code:c.code, value:c.value})))).flat(2)
\$\endgroup\$
  • \$\begingroup\$ also, the use of the command .flat() would help somehow in this solution? thanks. \$\endgroup\$ – Roger Oliveira Mar 29 '19 at 3:01
  • \$\begingroup\$ yes, if you have it. See my edit. \$\endgroup\$ – Oh My Goodness Mar 29 '19 at 13:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.