Creating an array of objects using a constructor: a step-by-step guide

Question

Creating an array of objects using a constructor: a step-by-step guide

a) Here is an example of an array containing objects with various properties:

[
    {
        "Account": "1111-000",
        "Desc": "Accrued - Payroll & Payroll Tax",
        "Amount": "-8,459.88",
        "Partner": "RAP",
        "FY": "2018",
        "PD": "10",
        "VNO": "abc"
    },
    {
        "Account": "2222-000",
        "Desc": "Accrued - Management Fee",
        "Amount": "-9,228.33",
        "Partner": "RAP",
        "FY": "2018",
        "PD": "10",
        "VNO": "dfe"
    },
    {
        "Account": "3333-000",
        "Desc": "Current Year Earnings",
        "Amount": "0",
        "Partner": "RAP",
        "FY": "2018",
        "PD": "10",
        "VNO": "bcd"
    },
]

b) To create a specific output based on the values from each object, I plan to iterate through the array and use a constructor function as follows:

gridinsert: [{
  value: "1111-000",
  command: "setGridValue",
  columnID: "17"
}, {
  value: "Accrued-Payroll & payroll tax",
  command: "setGridValue",
  columnID: "18"
}, {
  value: "-8,459.88",
  command: "setGridValue",
  columnID: "19"
}, {
  value: "RAP",
  command: "setGridValue",
  columnID: "20"
}, {
  value: "2018",
  command: "setGridValue",
  columnID: "12"
}, {
  value: "10",
  command: "setGridValue",
  columnID: "21"
}, {
  value: "abc",
  command: "setGridValue",
  columnID: "23"
}]

Since the JSON data maintains a consistent order, I can easily extract values and format them into separate objects within the gridinsert:[] structure for each original object.

javascript json algorithm

Answer 1

Answer №1

Is this the desired format you are searching for?

Each input element is linked to an output element with a characteristic gridinsert which consists of an array of elements created from each property in the input element.

The column identifiers are correlated to the property names utilizing an object:

const colIDs = {
  Account: 17,
  Desc: 18,
  Amount: 19,
  Partner: 20,
  FY: 12,
  PD: 21,
  VNO: 23
};

If the keys are inconsistent, for example, if there is a mix of uppercase or lowercase keys and potential mistakes in some keys, convert all keys to lowercase and insert entries for common errors or synonymous keys. Before using the map by key, ensure to convert the key to lowercase.

const colIDs = {
  account: 17,
  desc: 18,
  description: 18, // alternative to desc
  amount: 19,
  quantity: 19, // use this instead of amount
  partner: 20,
  fy: 12,
  pd: 21,
  vno: 23
};

The correlation is carried out through Object.entries and map:

const result = data.map(elem => ({
    gridinsert: Object.entries(elem).map(([key, value]) => ({
       value,
       command: 'setGridValue',
       columnID: colIDs[key.toLocaleLowerCase()]
     }))
}));

Here is an illustration:

const data = [{
    "account": "1111-000",
    "Desc": "Accrued - Payroll & Payroll Tax",
    "amount": "-8,459.88",
    "Partner": "RAP",
    "FY": "2018",
    "PD": "10",
    "VNO": "abc"
}, {
    "Account": "2222-000",
    "Description": "Accrued - Management Fee",
    "Amount": "-9,228.33",
    "Partner": "RAP",
    "FY": "2018",
    "PD": "10",
    "VNO": "dfe"
}, {
    "Account": "3333-000",
    "Desc": "Current Year Earnings",
    "Amount": "0",
    "Partner": "RAP",
    "FY": "2018",
    "PD": "10",
    "VNO": "bcd"
}];

const colIDs = {
  account: 17,
  desc: 18,
  description: 18,
  amount: 19,
  quantity: 19,
  partner: 20,
  fy: 12,
  pd: 21,
  vno: 23
};

const result = data.map(elem => 
    Object.entries(elem).map(([key, value]) => ({
       value,
       command: 'setGridValue',
       columnID: colIDs[key.toLocaleLowerCase()]
    })
));

console.log(result);

To compile all transformed properties of your input entities into a single array, you can follow this approach:

const result = data.reduce((acc, elem) => {
    const entries = Object.entries(elem).map(([key, value]) => ({
       value,
       command: 'setGridValue',
       columnID: colIDs[key.toLocaleLowerCase()]
     }));
    acc = [...acc, ...entries];
    return acc;
}, []);

However, employing this method may lead to conflicts between properties that have identical values.

const data = [..]; // same data as above

const colIDs = {..}; // same colIDs as above

const result = data.reduce((acc, elem) => {
  const entries = Object.entries(elem).map(([key, value]) => ({
     value,
     command: 'setGridValue',
     columnID: colIDs[key.toLocaleLowerCase()]
   }));
  acc = [...acc, ...entries];
  return acc;
}, []);

console.log(result);

Answer 2

Is this the desired format you are searching for?

Each input element is linked to an output element with a characteristic gridinsert which consists of an array of elements created from each property in the input element.

The column identifiers are correlated to the property names utilizing an object:

const colIDs = {
  Account: 17,
  Desc: 18,
  Amount: 19,
  Partner: 20,
  FY: 12,
  PD: 21,
  VNO: 23
};

If the keys are inconsistent, for example, if there is a mix of uppercase or lowercase keys and potential mistakes in some keys, convert all keys to lowercase and insert entries for common errors or synonymous keys. Before using the map by key, ensure to convert the key to lowercase.

const colIDs = {
  account: 17,
  desc: 18,
  description: 18, // alternative to desc
  amount: 19,
  quantity: 19, // use this instead of amount
  partner: 20,
  fy: 12,
  pd: 21,
  vno: 23
};

The correlation is carried out through Object.entries and map:

const result = data.map(elem => ({
    gridinsert: Object.entries(elem).map(([key, value]) => ({
       value,
       command: 'setGridValue',
       columnID: colIDs[key.toLocaleLowerCase()]
     }))
}));

Here is an illustration:

const data = [{
    "account": "1111-000",
    "Desc": "Accrued - Payroll & Payroll Tax",
    "amount": "-8,459.88",
    "Partner": "RAP",
    "FY": "2018",
    "PD": "10",
    "VNO": "abc"
}, {
    "Account": "2222-000",
    "Description": "Accrued - Management Fee",
    "Amount": "-9,228.33",
    "Partner": "RAP",
    "FY": "2018",
    "PD": "10",
    "VNO": "dfe"
}, {
    "Account": "3333-000",
    "Desc": "Current Year Earnings",
    "Amount": "0",
    "Partner": "RAP",
    "FY": "2018",
    "PD": "10",
    "VNO": "bcd"
}];

const colIDs = {
  account: 17,
  desc: 18,
  description: 18,
  amount: 19,
  quantity: 19,
  partner: 20,
  fy: 12,
  pd: 21,
  vno: 23
};

const result = data.map(elem => 
    Object.entries(elem).map(([key, value]) => ({
       value,
       command: 'setGridValue',
       columnID: colIDs[key.toLocaleLowerCase()]
    })
));

console.log(result);

To compile all transformed properties of your input entities into a single array, you can follow this approach:

const result = data.reduce((acc, elem) => {
    const entries = Object.entries(elem).map(([key, value]) => ({
       value,
       command: 'setGridValue',
       columnID: colIDs[key.toLocaleLowerCase()]
     }));
    acc = [...acc, ...entries];
    return acc;
}, []);

However, employing this method may lead to conflicts between properties that have identical values.

const data = [..]; // same data as above

const colIDs = {..}; // same colIDs as above

const result = data.reduce((acc, elem) => {
  const entries = Object.entries(elem).map(([key, value]) => ({
     value,
     command: 'setGridValue',
     columnID: colIDs[key.toLocaleLowerCase()]
   }));
  acc = [...acc, ...entries];
  return acc;
}, []);

console.log(result);

Answer 3

Answer №2

One approach to tackle this issue is by creating a mapping between object keys and the corresponding columns ids. This can be achieved as follows:

const keyValueMapping = {
    "Account": "17",
    "Desc": "18",
    "Amount": "19",
    "Partner": "20",
    "FY": "12",
    "PD": "21",
    "VNO": "23"
}

You can then utilize the reduce() function on your array to generate the desired outcome:

const data = [
    {
        "Account": "1111-000",
        "Desc": "Accrued - Payroll & Payroll Tax",
        "Amount": "-8,459.88",
        "Partner": "RAP",
        "FY": "2018",
        "PD": "10",
        "VNO": "abc"
    },
    {
        "Account": "2222-000",
        "Desc": "Accrued - Management Fee",
        "Amount": "-9,228.33",
        "Partner": "RAP",
        "FY": "2018",
        "PD": "10",
        "VNO": "dfe"
    },
    {
        "Account": "3333-000",
        "Desc": "Current Year Earnings",
        "Amount": "0",
        "Partner": "RAP",
        "FY": "2018",
        "PD": "10",
        "VNO": "bcd"
    }
];

const keyValueMapping = {
    "Account": "17",
    "Desc": "18",
    "Amount": "19",
    "Partner": "20",
    "FY": "12",
    "PD": "21",
    "VNO": "23"
}

let gridInsertsArray = data.reduce((accumulator, object) =>
{
    let gridInsert = [];

    Object.keys(object).forEach(
        key => gridInsert.push({
            value: object[key],
            command: "setGridValue",
            columnID: keyValueMapping[key]
        })
    );    

    return [...accumulator, gridInsert];
}, []);

console.log(gridInsertsArray);

Answer 4

One approach to tackle this issue is by creating a mapping between object keys and the corresponding columns ids. This can be achieved as follows:

const keyValueMapping = {
    "Account": "17",
    "Desc": "18",
    "Amount": "19",
    "Partner": "20",
    "FY": "12",
    "PD": "21",
    "VNO": "23"
}

You can then utilize the reduce() function on your array to generate the desired outcome:

const data = [
    {
        "Account": "1111-000",
        "Desc": "Accrued - Payroll & Payroll Tax",
        "Amount": "-8,459.88",
        "Partner": "RAP",
        "FY": "2018",
        "PD": "10",
        "VNO": "abc"
    },
    {
        "Account": "2222-000",
        "Desc": "Accrued - Management Fee",
        "Amount": "-9,228.33",
        "Partner": "RAP",
        "FY": "2018",
        "PD": "10",
        "VNO": "dfe"
    },
    {
        "Account": "3333-000",
        "Desc": "Current Year Earnings",
        "Amount": "0",
        "Partner": "RAP",
        "FY": "2018",
        "PD": "10",
        "VNO": "bcd"
    }
];

const keyValueMapping = {
    "Account": "17",
    "Desc": "18",
    "Amount": "19",
    "Partner": "20",
    "FY": "12",
    "PD": "21",
    "VNO": "23"
}

let gridInsertsArray = data.reduce((accumulator, object) =>
{
    let gridInsert = [];

    Object.keys(object).forEach(
        key => gridInsert.push({
            value: object[key],
            command: "setGridValue",
            columnID: keyValueMapping[key]
        })
    );    

    return [...accumulator, gridInsert];
}, []);

console.log(gridInsertsArray);

Creating an array of objects using a constructor: a step-by-step guide

Answer №1

Answer №2

Similar questions

What is the best way to handle a nested list() that arises while parsing JSON files in R?

Tips to prevent modal impacts on underlying elements?

What is the best way to substitute a character in a string with a specific text?

What is the best way to convert a multi-line result into a JSON format?

Disable the default page scrolling behavior when collapsing an accordion section in Bootstrap 4 framework

Troubleshooting Issue with InfoWindow Display on Multiple Markers in Google Maps

How can I adjust the font size of material-ui buttons while ensuring that they scale appropriately?

Exploring the depths of web automation using Python and Selenium, harnessing the power of a while

Should you include the dollar sign in a Vue HTML variable or not?

Sending an array of functions to the onClick event of a button

Analyzing vast datasets from contrasting perspectives

What is the best way to generate the message dynamically?

Setting up React Router in a nested directory with a flexible route structure

Unable to determine the dimensions of the Kafka JSON message

What method can I use in webpage coding to achieve this special highlight effect, and what is the official term for it?

Using Local Storage to store arrays in JavaScript/jQuery

I'm having trouble decoding the response from the Tweepy API in Python. Can anyone lend

Set the height of a div based on the height of another div

Retrieving Article URL from JSON Object in C# - A Step-by-Step Guide

Adding data to an AngularJS template