Javascript - 平面图的解决方法

Question

So I was looking for some workaround for flat map as it doesn't work on IE and I find this one: But I don't really understand why does it work

var gadjets = [
  {computers:['asus', 'hp'],
  sellphones:['Galaxy', 'Nokia']
  },

  {computers:['dell', 'insys'],
  sellphones:['iphone', 'samsung']
  }
];

const getValues = gadjets.reduce((acc, gadjet) => acc.concat(gadjet[computers]), []) // instead of gadjets.flatMap(gadjet=> gadjet[computers])

This code returns:

['asus','hp','dell','insys']

But shouldn't it return:

['asus','hp'],['dell', 'insys']

Answer 1

This is because reduce adds up the elements you give it. For example, take the following code:

let arr = [1,2,3,4,5];
console.log(arr.reduce((before, value)=>before+value));

This code takes each value and adds it to before . It then passes that added value into the next iteration of reduce , in the before variable.

In your code, you were passing an array into before , or in your case acc , and concatenates (merge) a new array from gadgets['computers'] and returns that array. This creates a list of the computers from the array of objects.

More info on reduce here .

Answer 2

In case you want the output to be array of arrays. Try this:

 var gadjets = [ { computers: ["asus", "hp"], sellphones: ["Galaxy", "Nokia"] }, { computers: ["dell", "insys"], sellphones: ["iphone", "samsung"] } ]; const groupBy = key => { let res = gadjets.reduce((objectsByKeyValue, obj) => { let arr = []; arr.push(obj[key]); return objectsByKeyValue.concat(arr); }, []); return res; }; console.log(groupBy("computers"));

Answer 3

But shouldn't it return

I'm not sure what you're trying to show us there, but if you mean

[['asus','hp'],['dell', 'insys']]

then no, it shouldn't. concat flattens arrays you pass it (to a single level):

 const a = [].concat(['asus','hp'], ['dell', 'insys']); console.log(a); // ["asus", "hp", "dell", "insys"]

So acc.concat(gadjet[computers]) flattens out each of those computers arrays into a new array, which is the accumulation result of the reduce .