JavaScript: Using Reduce Method to Merge Together Multiple Arrays Into One Array

Question

I have the following code below:

const intersection = (arr) => {

  //console.log(arr)

  return arr.reduce((a,e) => a+e, [])

}

const arr1 = [5, 10, 15, 20];
const arr2 = [15, 88, 1, 5, 7];
const arr3 = [1, 10, 15, 5, 20];
console.log(intersection([arr1, arr2, arr3]));

I am expecting my code to print [5,10,15,2015,88,1,5,71,10,15,5,20] but instead it's printing 5,10,15,2015,88,1,5,71,10,15,5,20

What am I doing wrong?

Answer 1

You are trying to combine the arrays with the + operator. Since arrays don't support the + operator, they are casted to strings. You can use array spread or Array.concat() to combine them using Array.reduce() :

 const intersection = arr => arr.reduce((a, e) => [...a, ...e], []) const arr1 = [5, 10, 15, 20]; const arr2 = [15, 88, 1, 5, 7]; const arr3 = [1, 10, 15, 5, 20]; console.log(intersection([arr1, arr2, arr3])); 

Or you can use Array.flat() :

 const intersection = arr => arr.flat(); const arr1 = [5, 10, 15, 20]; const arr2 = [15, 88, 1, 5, 7]; const arr3 = [1, 10, 15, 5, 20]; console.log(intersection([arr1, arr2, arr3])); 

Answer 2

Don't use + to add arrays. Use concat instead:

 const intersection = arr => arr.reduce((a, e) => a.concat(e), []); const arr1 = [5, 10, 15, 20]; const arr2 = [15, 88, 1, 5, 7]; const arr3 = [1, 10, 15, 5, 20]; console.log(intersection([arr1, arr2, arr3])); 

 .as-console-wrapper { max-height: 100% !important; top: auto; }