How to put dynamic data under a array of objects?

Question

This is how I get the data:

const dataSaved = [{
  count: 52,
  deliveryAmount: 0,
  discountAmount: 7,
  guests: 2,
  refundedAmount: 9,
  serviceChargeAmount: 4,
  storeId: "aslkasad",
  subtotal: 2,
  taxAmount: 4,
  total: 3
}, {
  count: 52,
  deliveryAmount: 0,
  discountAmount: 7,
  guests: 2,
  refundedAmount: 9,
  serviceChargeAmount: 4,
  storeId: "ldfgfgdf",
  subtotal: 2,
  taxAmount: 4,
  total: 3
}]

So basically I have made a method in which I'm filtering an array of objects and just taking out the fields I need:

getDataParsed(dataSaved, storeFieldRequired) {
  const barData = [];
  for (const store of dataSaved) {
    barData.push({
      data: [store.storeFieldRequired],
      label: store.storeId
    });
  }
  return barData;
}

When I want to get an specific field of the array, my [store.storeFieldRequired] brings undefined. How can I solve it?

Change [store.storeFieldRequired] => [store[storeFieldRequired]] — Abror Abdullaev, Oct 13 '20 at 08:54
Hey I think you need to use the square brackets notation like this `store[storeFieldRequired]` otherwise it will actually try to find the value `storeFieldRequired` (not the value of the parameter, but the actual name) inside `store`. — Carlo Moretti, Oct 13 '20 at 08:54
You can dynamically retrieve property values from an object using the [bracket property accessor notation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors), which accepts a string for the property name, eg `const o = { foo: 'my value' }; console.log(o['foo']); // 'my value'` — Ben Aston, Oct 13 '20 at 09:10
Does this answer your question? [Dynamically access object property using variable](https://stackoverflow.com/questions/4244896/dynamically-access-object-property-using-variable) — Heretic Monkey, May 02 '21 at 18:03

score 0 · Answer 1 · answered Oct 13 '20 at 08:55

Access the variable with bracket-[] notation. Example => data: [store[storeFieldRequired]].

 getDataParsed(storeData, storeFieldRequired) {
        const barData = [];
        for (const store of storeData) {
          barData.push({
            data: [store[storeFieldRequired]], // change this line from data: [store.storeFieldRequired] to data: [store[storeFieldRequired]]
            label: store.storeId
          });
        }
        return barData;
    }

score 0 · Accepted Answer · answered Oct 13 '20 at 09:05

Instead of using store.storeFieldRequired, it is needed to use store[storeFieldRequired]. They have different meanings.

store.storeFieldRequired means to get the value of storeFieldRequired key on store object.

store[storeFieldRequired] means to get the value of storeFieldRequired variable value key on store object.

const dataSaved = [{
  count: 52,
  deliveryAmount: 0,
  discountAmount: 7,
  guests: 2,
  refundedAmount: 9,
  serviceChargeAmount: 4,
  storeId: "aslkasad",
  subtotal: 2,
  taxAmount: 4,
  total: 3
}, {
  count: 52,
  deliveryAmount: 0,
  discountAmount: 7,
  guests: 2,
  refundedAmount: 9,
  serviceChargeAmount: 4,
  storeId: "ldfgfgdf",
  subtotal: 2,
  taxAmount: 4,
  total: 3
}];


function getDataParsed(dataSaved, storeFieldRequired) {
  const barData = [];
  for (const store of dataSaved) {
    barData.push({
      data: [store[storeFieldRequired]],
      label: store.storeId
    });
  }
  return barData;
}

console.log(getDataParsed(dataSaved, 'count'));

Simply, using Array.prototype.map, you can get the result.

const dataSaved = [{
  count: 52,
  deliveryAmount: 0,
  discountAmount: 7,
  guests: 2,
  refundedAmount: 9,
  serviceChargeAmount: 4,
  storeId: "aslkasad",
  subtotal: 2,
  taxAmount: 4,
  total: 3
}, {
  count: 52,
  deliveryAmount: 0,
  discountAmount: 7,
  guests: 2,
  refundedAmount: 9,
  serviceChargeAmount: 4,
  storeId: "ldfgfgdf",
  subtotal: 2,
  taxAmount: 4,
  total: 3
}];


function getDataParsed(dataSaved, storeFieldRequired) {
  return dataSaved.map((item) => ({
    data: [item[storeFieldRequired]],
    label: item.storeId
  }));
}

console.log(getDataParsed(dataSaved, 'count'));

Really but really helpfull !!! Thanks for also using arrya info and a live example — Alexis, Oct 13 '20 at 22:27

How to put dynamic data under a array of objects?

2 Answers2