Format object with some keys to array-CodePudding

It gets a specific result from my database which I have shown below:


const data = {
  short: 'en',
  element: {
    'dsdsea-22dada-2ffgd-xxada-eeee': { name: 'test name', comment: 'test comment' },
    'adad2a-dda13-dsdad-wwwwd-adaxx': { name: 'name 2' },
}

And I would like to apply a JavaScript operation to be able to get this result:

[
    {
        short: 'en',
        key: "dsdsea-22dada-2ffgd-xxada-eeee.name"
    value: "test name"
    },
    {
        short: 'en',
        key: "dsdsea-22dada-2ffgd-xxada-eeee.comment"
    value: "test comment"
    },
    {
        short: 'en',
        key: "adad2a-dda13-dsdad-wwwwd-adaxx.name"
    value: "name 2"
    }
]

I have tried using a combination of Object.entries and the map function, but I don't know how to deal with double keys in a single element object.

CodePudding user response：

You'll need two loops to iterate over each element and then each value of those elements.

Here using for...of loops on the Object.entries() of each, destructuring at each level to apply relevant names to each property, and then creating a compound key value using a template literal

const data = {
  short: 'en',
  element: {
    'dsdsea-22dada-2ffgd-xxada-eeee': { name: 'test name', comment: 'test comment' },
    'adad2a-dda13-dsdad-wwwwd-adaxx': { name: 'name 2' },
  }
}

const result = [];
for (const [key, element] of Object.entries(data.element)) {
  for (const [prop, value] of Object.entries(element)) {
    result.push({ short: data.short, key: `${key}.${prop}`, value })
  }
}

console.log(result)

CodePudding user response：

You can do:

const data = {short: 'en',element: {'dsdsea-22dada-2ffgd-xxada-eeee': {name: 'test name',comment: 'test comment'},'adad2a-dda13-dsdad-wwwwd-adaxx': {name: 'name 2'}}}

const result = Object
  .entries(data.element)
  .reduce((a, [key, obj]) => [
    ...a,
    ...Object
      .values(obj)
      .map(value => ({
        ...{
          short: data.short,
          key
        },
        value
      }))
  ], [])

console.log(result)

CodePudding user response：

This may be one possible solution to achieve the desired objective.

It uses Object.entries(), .map(), .flatMap() and template literal using backtick `` characters.

Code Snippet

const getTransformedArray = obj => (
  Object.entries(obj.element)   // iterate over 'element' key-value pairs
  .flatMap(([k1, v1]) => (      // k1-v1 where v1 is object (with name, comment props)
    Object.entries(v1)          // iterate over v1's key-value pairs
    .map(([k2, v2]) => ({       // map each iteration
      short: obj.short,         // create the resulting object
      key: `${k1}.${k2}`,       // 'key' is created using k1, k2
      value: v2                 // 'value' is v2 as-is
    }))
  ))                            // '.flatMap' used above avoids nesting of arrays
);

const data = {
  short: 'en',
  element: {
    'dsdsea-22dada-2ffgd-xxada-eeee': { name: 'test name', comment: 'test comment' },
    'adad2a-dda13-dsdad-wwwwd-adaxx': { name: 'name 2' }
  }
};

console.log(getTransformedArray(data));

Explanation

Inline comments in the code-snippet above explain how the code works.

EDIT

Answer updated to use .flatMap() as has been highlighted by @pilchard.

CodePudding user response：

Use Object.keys() to get the keys in element, then map the returned array using the key to access each element object and thus getting the name. Here's the full code snippet:

const input = {
    short: 'en',
    element: {
        'dsdsea-22dada-2ffgd-xxada-eeee': { name: 'test name', comment: 'test comment' },
        'adad2a-dda13-dsdad-wwwwd-adaxx': { name: 'name 2' },
    },
};

function format(data = {}) {
    const { short = '', element = {} } = data;

    const result = Object.keys(element).map((key) => {
        const value = element[key]?.name || '';
        return { short, key, value };
    });

    return result;
}

const result = format(input);

this prints:

[
  {
    "short": "en",
    "key": "dsdsea-22dada-2ffgd-xxada-eeee",
    "value": "test name"
  },
  {
    "short": "en",
    "key": "adad2a-dda13-dsdad-wwwwd-adaxx",
    "value": "name 2"
  }
]