CODEWITHSUNDEEP
javascriptarraysecmascript-6
Ross Summerell
Ross Summerell

Reputation: 51

Merging two Arrays on Unique ID

I am looking for some advice on how to improve this method as I don't like the work around.

I have two Object Arrays with Json.

The first has all the dates in a date range, the second list comes from a SQL query, where some months may be missing.

The desired out come needs to be a list with all the months in order with a matterCount, however when I load them into the function below I am missing the matterCount on months that did not exist on the list.

I think that I am just missing a little bit of code out the function, but I am not entirely sure what, hence coming here.

I do have a work around which is in the JSFiddle but I would prefer clearer code.

let x = [{labelDate: "Jun 2013"},
{labelDate: "Jul 2013"},
{labelDate: "Aug 2013"},
{labelDate: "Sep 2013"},
{labelDate: "Oct 2013"},
{labelDate: "Nov 2013"},
{labelDate: "Dec 2013"},
{labelDate: "Jan 2014"},
{labelDate: "Feb 2014"},
{labelDate: "Mar 2014"},
{labelDate: "Apr 2014"},
{labelDate: "May 2014"}];


let y = [{labelDate: "Jun 2013", matterCount: "1"},
{labelDate: "Jul 2013", matterCount: "2"},
{labelDate: "Aug 2013", matterCount: "2"},
{labelDate: "Sep 2013", matterCount: "10"},
{labelDate: "Oct 2013", matterCount: "1"},
{labelDate: "Nov 2013", matterCount: "1"},
{labelDate: "Feb 2014", matterCount: "1"},
{labelDate: "Apr 2014", matterCount: "17"},
{labelDate: "May 2014", matterCount: "21"}];

const merge = (x, y) =>
            x.map(xItem => ({
              ...y.find(yItem => yItem.labelDate === xItem.labelDate && Item),
              ...xItem
            }));

Actual outcome 
merge = [{labelDate: "Jun 2013", matterCount: "1"},
{labelDate: "Jul 2013", matterCount: "2"},
{labelDate: "Aug 2013", matterCount: "2"},
{labelDate: "Sep 2013", matterCount: "10"},
{labelDate: "Oct 2013", matterCount: "1"},
{labelDate: "Nov 2013", matterCount: "1"},
{labelDate: "Dec 2013"},
{labelDate: "Jan 2014"},
{labelDate: "Feb 2014", matterCount: "1"},
{labelDate: "Mar 2014"},
{labelDate: "Apr 2014", matterCount: "17"},
{labelDate: "May 2014", matterCount: "21"}];

desired outcome 
merge  = [{labelDate: "Jun 2013", matterCount: "1"},
{labelDate: "Jul 2013", matterCount: "2"},
{labelDate: "Aug 2013", matterCount: "2"},
{labelDate: "Sep 2013", matterCount: "10"},
{labelDate: "Oct 2013", matterCount: "1"},
{labelDate: "Nov 2013", matterCount: "1"},
{labelDate: "Dec 2013", matterCount: "0"},
{labelDate: "Jan 2014", matterCount: "0"},
{labelDate: "Feb 2014", matterCount: "1"},
{labelDate: "Mar 2014", matterCount: "0"},
{labelDate: "Apr 2014", matterCount: "17"},
{labelDate: "May 2014", matterCount: "21"}];

https://jsfiddle.net/cp39aoyf/2/

Upvotes: 0

Views: 120

Answers (1)

acdcjunior
acdcjunior

Reputation: 135752

How about ||'ing a default value:

const merge = (x, y) =>
        x.map(xItem => ({
          ...y.find(yItem => yItem.labelDate === xItem.labelDate && yItem) || {...xItem, matterCount: "0"}
        }));

Demo JSFiddle.

Another way would be to simply add the default value which would be overriden by the yItem, if it exists:

const merge = (x, y) =>
    x.map(xItem => ({
      ...xItem,
      ...{matterCount: "0"},
      ...y.find(yItem => yItem.labelDate === xItem.labelDate && yItem)
    }));

Fiddle for this one.

Upvotes: 1

Related Questions