I want to combine two Javascript Array with Lodash (not concat)

Question

I have two array like below

  const registers = [{ user: 'Allen', type: 'phone' }, { user: 'Eric', type: 'email' }];
  const dates = ['20171225', '20180914'];

and I want they comebine like this

const result = [
  { user: 'Allen', type: 'phone', date: '20171225' }
  { user: 'Allen', type: 'phone', date: '20180914' }
  { user: 'Eric', type: 'email', date: '20171225' }
  { user: 'Eric', type: 'email', date: '20180914' }
];

I think there is an proper function of Lodash to use in this case, but I can't find it by myself. Is there any cool geek can help to get out of this hell. Thanks~

Is using lodash required? It's trivial to accomplish in vanilla JS — CertainPerformance
– CertainPerformance, Commented Sep 14, 2018 at 7:19

Orelsanpls · Accepted Answer · 2018-09-14 07:33:13Z

3

I agree to use of plugins instead of rewrite what people have made available. But when It's simple, using a plugin is complicating things, it's better to use the simplier soluce when there is one.

const registers = [{
  user: 'Allen',
  type: 'phone',
}, {
  user: 'Eric',
  type: 'email',
}];

const dates = [
  '20171225',
  '20180914',
];

const arr = registers.reduce((tmp, x) => [
  ...tmp,

  ...dates.map(y => ({
    ...x,

    date: y,
  })),
], []);

console.log(arr);

edited Sep 14, 2018 at 7:33

answered Sep 14, 2018 at 7:23

Orelsanpls

23.7k7 gold badges46 silver badges74 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Eddie Over a year ago

Output is not the same with desired output :)

Hsueh-Jen Over a year ago

That's right! but I think the variable of sample code can change like this tmp => registerList, x => register, y=> date

Chris Li · Accepted Answer · 2018-09-14 07:30:42Z

1

One method is with reduce + forEach, but any double loop should work.

const registers = [{ user: 'Allen', type: 'phone' }, { user: 'Eric', type: 'email' }];
const dates = ['20171225', '20180914'];
let answer = registers.reduce((acc, n) => {
  dates.forEach(x => {
    acc.push({user: n.user, type: n.type, date: x});
  });
  return acc;
 }, [])
 console.log(answer);

answered Sep 14, 2018 at 7:30

Chris Li

2,6711 gold badge11 silver badges24 bronze badges

Comments

FK82 · Accepted Answer · 2018-09-14 07:31:35Z

0

In this case, use of lodash doesn't yield much code reduction (you could simply replace the calls to _.map(a, ...) with a.map(...)). But well, here goes:

const registers = [{ user: 'Allen', type: 'phone' }, { user: 'Eric', type: 'email' }];
const dates = ['20171225', '20180914'];
  
const result = _.map(registers, ({ user, type }) => _.map(dates, (date) => ({ user, type, date })));

console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.core.js"></script>

answered Sep 14, 2018 at 7:31

FK82

5,0754 gold badges34 silver badges44 bronze badges

Comments

Farooq Ahmed Khan · Accepted Answer · 2018-09-14 09:39:55Z

-1

As OP stated to use lodash , Here is a solution

Lodash Variant

var registers = [{ user: 'Allen', type: 'phone' }, { user: 'Eric', type: 'email' }];
var dates = ['20171225', '20180914'];

let result = _.map(registers, function(value, index, _source){
  return _.extend(value, { date: (dates[index] || null)});
});

console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.core.min.js"></script>

Vanilla JS Variant

var registers = [{ user: 'Allen', type: 'phone' }, { user: 'Eric', type: 'email' }];
var dates = ['20171225', '20180914'];

let result = registers.map(function(value, index, _source){
  return Object.assign(value, { date: (dates[index] || null)});
});

console.log(result);

Updated Answer

var registers = [{ user: 'Allen', type: 'phone' }, { user: 'Eric', type: 'email' }];
var dates = ['20171225', '20180914'];

const result = _.flatten(_.map(registers, function(value, index, _source){
  return _.map(dates, (v, i, _s) => _.extend(value, { date: v})); 
}));

console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.core.js"></script>

edited Sep 14, 2018 at 9:39

answered Sep 14, 2018 at 7:39

Farooq Ahmed Khan

4,0943 gold badges29 silver badges36 bronze badges

5 Comments

Farooq Ahmed Khan Over a year ago

please state a reason for downvote to help the person improve it.

Orelsanpls Over a year ago

I see that the snippet result is not matching with OP's request

Farooq Ahmed Khan Over a year ago

Can you please justify, where is the difference? :-) As my solution & output both appears to be complying with the OP's requirement. I posted vanilla js solution only but now updated it to use lodash as well.

Orelsanpls Over a year ago

Asked result contains 4 data at the end of it. There is an 'Allen' and an 'Eric' for every different dates. In the OP's example, two name + two date = 4 data

Farooq Ahmed Khan Over a year ago

oops, I got it. Thank you ^

Collectives™ on Stack Overflow

I want to combine two Javascript Array with Lodash (not concat)

4 Answers 4

2 Comments

Comments

Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related