Create array of objects from another array of objects

Question

(Sorry for the title)

What is the best way to turn this:

[
    {
      directory: 'video_0',
      files: [ 'comp_0.mp4', 'comp_1.mp4' ],
      uploadedFiles: ['video_0/comp_0.mp4','video_0/comp_1.mp4']
    },
    {
      directory: 'video_1',
      files: [ 'comp_0.mp4', 'comp_1.mp4' ],
      uploadedFiles: ['video_1/comp_0.mp4','video_1/comp_1.mp4']
    },
    {
      directory: 'video_2',
      files: [ 'comp_0.mp4', 'comp_1.mp4' ],
      uploadedFiles: ['video_2/comp_0.mp4','video_2/comp_1.mp4']
    }
  ]

Into this:

[
  {
    file: 'comp_0.mp4',
    directory: 'video_0',
    uploadedFile: 'video_0/comp_0.mp4',
  },
  {
    file: 'comp_1.mp4',
    directory: 'video_0',
    uploadedFile: 'video_0/comp_1.mp4',
  },
  {
    file: 'comp_0.mp4',
    directory: 'video_1',
    uploadedFile: 'video_1/comp_0.mp4',
  },
  {
    file: 'comp_1.mp4',
    directory: 'video_1',
    uploadedFile: 'video_1/comp_1.mp4',
  },
  {
    file: 'comp_0.mp4',
    directory: 'video_2',
    uploadedFile: 'video_2/comp_0.mp4',
  },
  {
    file: 'comp_1.mp4',
    directory: 'video_2',
    uploadedFile: 'video_2/comp_1.mp4',
  }]

And then back again...

I receive data in a certain structure, then I need to create a task list for each file. Then convert it back to it's original structure. I'm sure there will be some clever ES6 way of doing this but I can't figure it out.

Answer 1

a very crude implementation would be:

const data = [
  {
    directory: 'video_0',
    files: ['comp_0.mp4', 'comp_1.mp4'],
    uploadedFiles: ['video_0/comp_0.mp4', 'video_0/comp_1.mp4']
  },
  {
    directory: 'video_1',
    files: ['comp_0.mp4', 'comp_1.mp4'],
    uploadedFiles: ['video_1/comp_0.mp4', 'video_1/comp_1.mp4']
  },
  {
    directory: 'video_2',
    files: ['comp_0.mp4', 'comp_1.mp4'],
    uploadedFiles: ['video_2/comp_0.mp4', 'video_2/comp_1.mp4']
  }
];

const newArr = data.reduce((p, c) => {
  return p.concat(c.files.map((file, i) => {
    return {
      directory: c.directory,
      file,
      uploadedFile: c.uploadedFiles[i]
    };
  }));
}, []);

There are probably much cleaner solutions out there. what I did was a simple array Zip implementation.

you can check more about zipping here: How do I zip two arrays in JavaScript?