How can you use JavaScript to convert a collection of Objects into a fresh Object set?

Question

How can you use JavaScript to convert a collection of Objects into a fresh Object set?

This inquiry has been presented in various formats, but I have yet to consolidate all the information in order to achieve the desired result. My apologies for reiterating what has already been addressed...

My objective is to transform an Array structure similar to this:

[
  0: { 
       2014: "6", 
       2015: "19",
       2016: "3",
       2017: "12",
       Name: "Jerry"
     },
  1: { 
       2014: "16", 
       2015: "9",
       2016: "",
       2017: "16",
       Name: "Bill"
     },
  2: { 
       2014: "", 
       2015: "2",
       2016: "43",
       2017: "7",
       Name: "Grace"
     }
]

To a format resembling this:

{
    "years": {
        "2014": {
            "Jerry": 6,
            "Bill": 16,
            "Grace": ""
        },
        "2015": {
            "Jerry": 19,
            "Bill": 9,
            "Grace": 2
        },
        "2016": {
            "Jerry": 3,
            "Bill": "",
            "Grace": 43
        },
        "2017": {
            "Jerry": 12,
            "Bill": 16,
            "Grace": 7
        }
    }
}

Here is a snippet of code that remains after numerous attempts and modifications:

For your information, the data is sourced from a CSV file loaded through D3.js csv()

let loadData = () => {
    return d3.csv(dataFile, function cb (err, d) {
        if (err) throw err;
        return d;
    });
};

loadData().get((err, n) => {
    if (err) throw err;

    let years = [];

    years.push(Object.keys(n[0]));

    years = _.flatten(years);
    years.splice(-1, 1);


    console.log(n[0]);

    n.map((x) => {
        console.log(Object.keys(x[0]));
    });

});

javascript arrays json javascript-objects

Answer 1

Answer №1

If you want to achieve this task, you can utilize the "reduce" method.

var dataset = [{
  2014: "6",
  2015: "19",
  2016: "3",
  2017: "12",
  Name: "Melissa"
}, {
  2014: "16",
  2015: "9",
  2016: "",
  2017: "16",
  Name: "Tom"
}, {
  2014: "",
  2015: "2",
  2016: "43",
  2017: "7",
  Name: "Linda"
}];

dataset = dataset.reduce(function(prev, item) {

  for (var prop in item) {
    if (prop === 'Name') {
      continue;
    }
    if (!prev[prop]) {
      prev[prop] = {};
    };

    prev[prop][item.Name] = item[prop];

  }
  return prev;
}, {});
dataset = {
  yearsData: dataset
};
console.log(dataset);

Answer 2

If you want to achieve this task, you can utilize the "reduce" method.

var dataset = [{
  2014: "6",
  2015: "19",
  2016: "3",
  2017: "12",
  Name: "Melissa"
}, {
  2014: "16",
  2015: "9",
  2016: "",
  2017: "16",
  Name: "Tom"
}, {
  2014: "",
  2015: "2",
  2016: "43",
  2017: "7",
  Name: "Linda"
}];

dataset = dataset.reduce(function(prev, item) {

  for (var prop in item) {
    if (prop === 'Name') {
      continue;
    }
    if (!prev[prop]) {
      prev[prop] = {};
    };

    prev[prop][item.Name] = item[prop];

  }
  return prev;
}, {});
dataset = {
  yearsData: dataset
};
console.log(dataset);

Answer 3

Answer №2

One possible solution is to loop through the array and keys to construct a new object.

var data = [{ 2014: "6", 2015: "19", 2016: "3", 2017: "12", Name: "Jerry" }, { 2014: "16", 2015: "9", 2016: "", 2017: "16", Name: "Bill" }, { 2014: "", 2015: "2", 2016: "43", 2017: "7", Name: "Grace" }],
    grouped = { years: {} };

data.forEach(function (o) {
    Object.keys(o).forEach(function (k) {
        if (k !== 'Name') {
            grouped.years[k] = grouped.years[k] || {};
            grouped.years[k][o.Name] = o[k];
        }
    });
});

console.log(grouped);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 4

One possible solution is to loop through the array and keys to construct a new object.

var data = [{ 2014: "6", 2015: "19", 2016: "3", 2017: "12", Name: "Jerry" }, { 2014: "16", 2015: "9", 2016: "", 2017: "16", Name: "Bill" }, { 2014: "", 2015: "2", 2016: "43", 2017: "7", Name: "Grace" }],
    grouped = { years: {} };

data.forEach(function (o) {
    Object.keys(o).forEach(function (k) {
        if (k !== 'Name') {
            grouped.years[k] = grouped.years[k] || {};
            grouped.years[k][o.Name] = o[k];
        }
    });
});

console.log(grouped);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 5

Answer №3

To construct an object, you can utilize the `reduce()` method along with `Object.keys()` and a `forEach()` loop to dynamically add objects for each year.

var data = [{"2014":"6","2015":"19","2016":"3","2017":"12","Name":"Jerry"},{"2014":"16","2015":"9","2016":"","2017":"16","Name":"Bill"},{"2014":"","2015":"2","2016":"43","2017":"7","Name":"Grace"}]

var output = data.reduce(function(result, obj) {
  Object.keys(obj).forEach(function(key) {
    if(!result.years[key] && key != 'Name') result.years[key] = {}
    Object.assign(result.years[key] || {}, {[obj.Name]: obj[key]})
  })
  return result;
}, {years: {}})

console.log(JSON.stringify(output, null, 4))

Answer 6

To construct an object, you can utilize the `reduce()` method along with `Object.keys()` and a `forEach()` loop to dynamically add objects for each year.

var data = [{"2014":"6","2015":"19","2016":"3","2017":"12","Name":"Jerry"},{"2014":"16","2015":"9","2016":"","2017":"16","Name":"Bill"},{"2014":"","2015":"2","2016":"43","2017":"7","Name":"Grace"}]

var output = data.reduce(function(result, obj) {
  Object.keys(obj).forEach(function(key) {
    if(!result.years[key] && key != 'Name') result.years[key] = {}
    Object.assign(result.years[key] || {}, {[obj.Name]: obj[key]})
  })
  return result;
}, {years: {}})

console.log(JSON.stringify(output, null, 4))

Answer 7

Answer №4

If you are faced with this situation, one approach is to utilize the Array.prototype.reduce method. The first parameter of this method is a reducer function, and the second one is the initial value.

var data = [{
    2014: "6",
    2015: "19",
    2016: "3",
    2017: "12",
    Name: "Jerry"
  },
  {
    2014: "16",
    2015: "9",
    2016: "",
    2017: "16",
    Name: "Bill"
  },
  {
    2014: "",
    2015: "2",
    2016: "43",
    2017: "7",
    Name: "Grace"
  }
];

var result = data.reduce((accumulator, current) => {
  for (var key in current) {
    if (key !== 'Name') {
      accumulator.year[key] = accumulator.year[key] || {};
      accumulator.year[key][current.Name] = current[key];
    }
  }
  return accumulator;
}, {
  years: {}
});

console.log(result);

Answer 8

If you are faced with this situation, one approach is to utilize the Array.prototype.reduce method. The first parameter of this method is a reducer function, and the second one is the initial value.

var data = [{
    2014: "6",
    2015: "19",
    2016: "3",
    2017: "12",
    Name: "Jerry"
  },
  {
    2014: "16",
    2015: "9",
    2016: "",
    2017: "16",
    Name: "Bill"
  },
  {
    2014: "",
    2015: "2",
    2016: "43",
    2017: "7",
    Name: "Grace"
  }
];

var result = data.reduce((accumulator, current) => {
  for (var key in current) {
    if (key !== 'Name') {
      accumulator.year[key] = accumulator.year[key] || {};
      accumulator.year[key][current.Name] = current[key];
    }
  }
  return accumulator;
}, {
  years: {}
});

console.log(result);

Answer 9

Answer №5

In some cases, reduce may not be necessary. Take this code snippet for example:

let data = { categories : {} };
for (let item of list) {
    for (let prop in item) {
        if (prop == 'Category') continue;
        data.categories[prop] = data.categories[prop] || {};
        data.categories[prop][item.Category] = item[prop];
    }
}

Answer 10

In some cases, reduce may not be necessary. Take this code snippet for example:

let data = { categories : {} };
for (let item of list) {
    for (let prop in item) {
        if (prop == 'Category') continue;
        data.categories[prop] = data.categories[prop] || {};
        data.categories[prop][item.Category] = item[prop];
    }
}

How can you use JavaScript to convert a collection of Objects into a fresh Object set?

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Similar questions

What is the best way to display the USD price in my JSON data?

Using Threejs JSONLoader and OOP to easily add models to a scene post-loading

Tips for correctly deciphering a JSON string that has been encoded using Html.Raw(Json.Encode(Model)):

Tips for generating JSON data in the correct format dynamically while continuously adding new information to the existing object

Using AngularJS to filter JSON data that is active

Troubleshooting Owl-Carousel Compatibility Issues in Javascript

Loading data with limit offset in AngularJS can lead to controller functions crashing and causing data to become jammed

Disable the default controls on the Open Layers Bing Map

Is there a Possible Bug with Highcharts Categories?

Adding a fresh selection to the Bootstrap menu

React encountered a 400 error when attempting to call a function in node.js

Unable to effectively translate placeholder text using i18next

"Learn how to update an existing table row and populate its cells with JSON data retrieved from a successful AJAX request without creating a

Encountered an error when attempting to decode the JSON file using the default decoder in Python

Could somebody provide clarification on the functions being called in the Angular Test Code, specifically evaluate() and dragAndDrop()?

Unravel the JSON data array and seamlessly add it to a MySQL database

ASP.NET not functioning correctly in returning JSON errors

Is there a way for me to generate a button that directs users to a variety of pages?

React-Redux Countdown Timer Component

Bidirectional data binding in AngularJS for <option> elements generated from an AJAX request