How to return an array of objects from array of arrays with array.map method?

Question

I use React and I have this array in Redux Persist reducer:

const data = [["2020-09-14","15:00","60","Info","April Tucker","Other","yes"],
["2020-09-14","2:00","50","Text","April Tucker","Other","yes"]]

I want to return a new array of objects (for each array in the array) with some of the values from the data array. Example of how it should look like:

let events = [{ title: data[0][3], date: data[0][0] },{ title: data[1][3], date: data[1][0]}]

I tried to use array.map method:

 let events [
    data.map((index) => ({
      title: data[index][3],
      date: data[index][0],
    })),
  ]

This does not work as I expected. How to do it properly?

first data.map((index) => ({ this is wrong , data.map((item,index) => ({}) the second arg is idx not the first one — Sim
– Sim, Commented Sep 2, 2020 at 12:57

Luke Storry · Accepted Answer · 2020-09-02 12:55:46Z

3

The .map function gives you each item of the array as a parameter in the callback function.

Use it like so:

const data = [
  ["2020-09-14", "15:00", "60", "Info", "April Tucker", "Other", "yes"],
  ["2020-09-14", "2:00", "50", "Text", "April Tucker", "Other", "yes"]
]

let events = data.map(item => ({
  title: item[3],
  date: item[0],
}))

console.log(events)

answered Sep 2, 2020 at 12:55

Luke Storry

6,7821 gold badge11 silver badges25 bronze badges

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

1 Comment

dim_dev Over a year ago

Thank you, it is pretty simple but I was trying many other solutions so I was a little bit frustrated :)

gbalduzzi · Accepted Answer · 2020-09-02 12:55:53Z

1

the callback on the map function takes the actual array item as the first argument and the index as the second, while your function takes index as the first.

Also, you are putting the result of the map operation inside square brackets [ ]. The array produced by map will be placed as the first element in a new array, while you probably don't want that

let events = data.map(arr => ({
  title: arr[3],
  date: arr[0],
})

answered Sep 2, 2020 at 12:55

gbalduzzi

10.3k3 gold badges36 silver badges65 bronze badges

Comments

yunzen · Accepted Answer · 2020-09-02 13:15:11Z

0

With destructuring and shorthand property names it's easy as one two three

const data = [["2020-09-14","15:00","60","Info","April Tucker","Other","yes"],
["2020-09-14","2:00","50","Text","April Tucker","Other","yes"]]

let events = data.map(([date,,,title]) => ({title, date}) )

console.log(events)

edited Sep 2, 2020 at 13:15

answered Sep 2, 2020 at 13:09

yunzen

33.5k13 gold badges79 silver badges114 bronze badges

Collectives™ on Stack Overflow

How to return an array of objects from array of arrays with array.map method?

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related