Creating array of objects from two arrays

I have two arrays like the following:

var directorAndFilms;

arrayOfFilmNames = [
  'Heat',
  'Summer Heat',
  'City Heat',
  'Heat',
  'Red Heat',
  'White Heat',
  'Heat of Midnight',
  'In the Heat of the Night: By Duty Bound',
  'Tropical Heat',
  'Delta Heat'
],
arrayOfDirectors = [
  'Michael Mann',
  'Monique van de Ven',
  'Richard Benjamin',
  'Jerry Jameson',
  'Robert Collector',
  'Raoul Walsh',
  'Max Pécas',
  'Harry Harris',
  'Jag Mundhra',
  'Michael Fischa'
]

I’m need to create an array of objects like the following:

[
  { name: 'Heat', director: 'Michael Mann' },
  { name: 'Summer Heat', director: 'Monique van de Ven' }
]

So far I’ve been able to do the following to achieve this:

var objOfFilmsAndDirectors = {};
arrayOfFilmNames.forEach(function(name, director) {
  objOfFilmsAndDirectors[name] = arrayOfFilmDirectors[director];
});

directorAndFilms = Object.entries(objOfFilmsAndDirectors).map(
  ([name, director]) => ({name, director}));

This is giving me the following result, which is not quite right, since it’s putting the wrong director for the first film Heat and there are no entries for Michael Mann.

[
  { name: 'Heat', director: 'Jerry Jameson' },
  { name: 'Summer Heat', director: 'Monique van de Ven' },
  { name: 'City Heat', director: 'Richard Benjamin' },
  { name: 'Red Heat', director: 'Robert Collector' },
  { name: 'White Heat', director: 'Raoul Walsh' },
  { name: 'Heat of Midnight', director: 'Max Pécas' },
  {
    name: 'In the Heat of the Night: By Duty Bound',
    director: 'Harry Harris'
  },
  { name: 'Tropical Heat', director: 'Jag Mundhra' },
  { name: 'Delta Heat', director: 'Michael Fischa' }
]

How can I handle this? Or maybe there’s a better way? Any help is appreciated.

Thanks.

So you have to match films and directors, right? But the two arrays don’t have a one-to-one correspondence? What is the link that shows which director belongs to which movie?

Also, couldn’t you just do something like newArr.push(arrayOfFilmNames( item => return {stuff in an object, this is a name/director pair}) to get the final structure?

Of course there’s relationship; every item in arrayOfFilmNames corresponds to the respective director in arrayOfDirectors by index. I’ve created those two arrays that way in the first place.

In that case, it looks like your code has all the pieces it needs. You have the callback function, you’re using the index parameter from the movie array, so you can use that to get the director. All you have to do is create and add the objects with the key value pairs in the target array, right? It looks to me as if the final line is harder than it needs to be, and is what’s tripping you up.

Sorry I just can’t get my head wrapped around it; it’s working fine except for cases with duplicate movie names so the final result is ending up with wrong information. I have no clue how to go about this.

Think I got another way to tackle this. Thanks for your response.

1 Like

Cool, good luck. I just messed around with it over here and I may have steered you a bit wrong. Seems you can’t directly push an object into an array. Let me know if you need anything else if it doesn’t come out for you!

I did just push an object into an array!

var finalForm = [];
var tempObj = {}
arrayOfFilmNames.forEach((key, i) => {
    tempObj.name = key;
    tempObj.director = arrayOfFilmDirectors[i];
    finalForm.push(tempObj);
    tempObj = {};
});

Perfect, I meant creating and pushing it like arr.push( {eueeouoe}).

Here’s how I did it, very similar.

// var directorAndFilms = [];
arrayOfFilmNames.forEach( (film, index) => {
//     let temp = {};
//     temp[film] = arrayOfDirectors[index];
//     directorAndFilms.push( temp );
//         }
//     )
1 Like

I would have used the map method

map? Could you give an example?

map returns an array, so you don’t need to use the push method to fill an array outside of the function

the callback would be pretty similar, returning the desired object instead of pushing to an array

1 Like