Porblem on Getting Array Inside of Array

Question

I have a problem on an object inside of an array and I wanted to display only that as an array.

data1

const data1 = [
  {
    "id": "01",
    "info": "fefef",
    "sub": "hieei",
    "details": {
      "data": "fruits"
    }
  },
  {
    "id": "02",
    "info": "fefef",
    "sub": "hieei",
    "details": {
      "data": "things"
    }
  }
]

expected output

const final= [
  {
    "data": "fruits"
  },
  {
    "data": "things"
  }
]

Code

 const final = data.map((data) => { ...data})

score 0 · Answer 1 · answered Nov 12 '21 at 03:57

0

Map through the array and extract its details property:

const data1 = [
  {
    "id": "01",
    "info": "fefef",
    "sub": "hieei",
    "details": {
      "data": "fruits"
    }
  },
  {
    "id": "02",
    "info": "fefef",
    "sub": "hieei",
    "details": {
      "data": "things"
    }
  }
]

const res = data1.map(e => e.details)

console.log(res)

answered Nov 12 '21 at 03:57

Spectric

30,714
6
20
43

What happens if the value of `details.data` of one of the objects changes in the original array? How is that reflected in `res`? – Andy Nov 12 '21 at 04:09

score 0 · Accepted Answer · answered Nov 12 '21 at 04:07

map over the array and return a new object using the details property. If you don't return a new object, your new array will still carry references to the objects in the original array. So if you change a value of a property in that original array, that change will be reflected in the new array too, and you probably don't want that to happen.

const data1=[{id:"01",info:"fefef",sub:"hieei",details:{data:"fruits"}},{id:"02",info:"fefef",sub:"hieei",details:{data:"things"}}];

// Make sure you return a copy of the
// details object otherwise if you change the details
// of the original objects in the array
// the new mapped array will carry those object changes
// because the array objects will simply references to the old objects
const out = data1.map(obj => {
  return { ...obj.details };
});

console.log(out);

I like my answers to be a little more verbose. And I do like a declarative return. — Andy, Nov 12 '21 at 04:15

score 0 · Answer 3 · answered Nov 13 '21 at 03:45

Using map and destructuring will simplify.

const data1 = [
  {
    id: "01",
    info: "fefef",
    sub: "hieei",
    details: {
      data: "fruits",
    },
  },
  {
    id: "02",
    info: "fefef",
    sub: "hieei",
    details: {
      data: "things",
    },
  },
];

const res = data1.map(({ details: { data } }) => ({ data }));

console.log(res);

// if you just need the details object

const res2 = data1.map(({ details }) => details);

console.log(res2);

Porblem on Getting Array Inside of Array

3 Answers3