Array 'map' vs 'forEach' - functional programming

Question

I have an array of objects:

let reports = [{ inbound_calls: [...], outbound_calls: [...],  outbound_national_calls: [...] },...];

What is the best way to create a new array and assign into a variable:

1st approach - one loop:

let inbound_calls = []; outbound_national_calls = [], outbound_calls = [];

reports.forEach((e) => {
 inbound_calls.push(e.inbound_calls);
 outbound_national_calls.push(e.outbound_national_calls);
 outbound_calls.push(e.outbound_calls);
})

2nd approach:

let inbound_calls = this.reports.map((report) => report.inbound_calls)
let outbound_national_calls = this.reports.map((report) => report.outbound_national_calls)
let outbound_calls = this.reports.map((report) => report.outbound_calls)

I'm starting to learn functional programming, and want to apply it to my code, I would go with first approach (one loop), but as I did research about functional programming I think the second one is the right way (much cleaner) but, I'm not sure, what is less expensive operation?

Answer 1

If your ultimate goal is to create three variables out of the object, you may use object destructuring as follows. No loops required.

 let reports = { inbound_calls: [1, 2, 3], outbound_calls: [4, 5, 6], outbound_national_calls: [7, 8, 9] }; let {inbound_calls, outbound_calls, outbound_national_calls} = reports; console.log(inbound_calls); console.log(outbound_calls); console.log(outbound_national_calls); 

Answer 2

If you want to copy the arrays, just use Array#slice (the 0 passed is optional as it is the default start index so you can omit it if you want) like:

let inbound_calls = reports.inbound_calls.slice(0),
    outbound_national_calls = reports.outbound_national_calls.slice(0), 
    outbound_calls = reports.outbound_calls.slice(0);

or Array.from like:

let inbound_calls = Array.from(reports.inbound_calls),
    outbound_national_calls = Array.from(reports.outbound_national_calls), 
    outbound_calls = Array.from(reports.outbound_calls);

Answer 3

What you're essentially doing is a matrix transposition:

 const report = (inbound_calls, outbound_calls, outbound_national_calls) => ({ inbound_calls, outbound_calls, outbound_national_calls }); const reports = [report(1,2,3), report(4,5,6), report(7,8,9)]; const transpose = reports => report( reports.map(report => report.inbound_calls) , reports.map(report => report.outbound_calls) , reports.map(report => report.outbound_national_calls) ); console.log(transpose(reports)); 

Now, depending upon your application the fastest way to transpose a matrix might be not to transpose it at all. For example, suppose you have a matrix A and its transpose B . Then, it holds that for all indices i and j , A[i][j] = B[j][i] . Consider:

 const report = (inbound_calls, outbound_calls, outbound_national_calls) => ({ inbound_calls, outbound_calls, outbound_national_calls }); const reports = [report(1,2,3), report(4,5,6), report(7,8,9)]; // This is equivalent to transpose(reports).outbound_calls[1] const result = reports[1].outbound_calls; console.log(result); 

That being said, your second approach is IMHO the most readable.