Combining two arrays of names and values into a fresh object using Javascript

Question

Combining two arrays of names and values into a fresh object using Javascript

Trying to merge two arrays, one for column headers:

cNames = ["Year","Count"]

And another for data:

mData  = ["2005",50212,"2006",51520,"2007",52220,"2008",52143]

The goal is to combine them like this:

[
    {
        Year: "2005",
        Count: 50212
    },
    {
        Year: "2006",
        Count: 51520
    },
    {
        Year: "2007",
        Count: 52220
    },
    {
        Year: "2008",
        Count: 52143
    }
]

Tried to achieve this with:

var data;
for (var i=0; i < mData.length; i++) {
    for (var j=0; j < cNames.length; j++) {
        data[cNames[j]]=mData[i];
    }
}

. . . but the output was not as expected. Any suggestions on how to fix this would be greatly appreciated!

javascript arrays json

Answer 1

Answer №1

To dynamically push elements to an array based on the length of the key array, you can use the reduce method in JavaScript. This approach allows for working with arrays of any size, as long as the keys and values align properly.

var cNames = ["Year","Count"]
var mData  = ["2005",50212,"2006",51520,"2007",52220,"2008",52143]

var arr = mData.reduce( (a,b,i) => {
  if (i%cNames.length === 0) 
    a.push(mData.slice(i,cNames.length+i).reduce((c,d,j) => (c[cNames[j]] = d, c),{}));
  return a;
}, []);

console.log(arr)

Answer 2

To dynamically push elements to an array based on the length of the key array, you can use the reduce method in JavaScript. This approach allows for working with arrays of any size, as long as the keys and values align properly.

var cNames = ["Year","Count"]
var mData  = ["2005",50212,"2006",51520,"2007",52220,"2008",52143]

var arr = mData.reduce( (a,b,i) => {
  if (i%cNames.length === 0) 
    a.push(mData.slice(i,cNames.length+i).reduce((c,d,j) => (c[cNames[j]] = d, c),{}));
  return a;
}, []);

console.log(arr)

Answer 3

Answer №2

Here is a step-by-step guide on how to accomplish this task

const labels = ["Year", "Count"];
const data = ["2005", 50212, "2006", 51520, "2007", 52220, "2008", 52143];

let index = 0;
let finalResult = [];
while(index < data.length){
    let temporaryObject = {};
    for(let j=0; j<labels.length; j++){
        temporaryObject[labels[j]] = data[index+j];
    }
    finalResult.push(temporaryObject);
    index += labels.length;
}
console.log(finalResult);

Answer 4

Here is a step-by-step guide on how to accomplish this task

const labels = ["Year", "Count"];
const data = ["2005", 50212, "2006", 51520, "2007", 52220, "2008", 52143];

let index = 0;
let finalResult = [];
while(index < data.length){
    let temporaryObject = {};
    for(let j=0; j<labels.length; j++){
        temporaryObject[labels[j]] = data[index+j];
    }
    finalResult.push(temporaryObject);
    index += labels.length;
}
console.log(finalResult);

Answer 5

Answer №3

Or perhaps we can try a different method :)

var categories = ["Year","Count"];
var data  = ["2005",50212,"2006",51520,"2007",52220,"2008",52143];

var result = [];
for (var i = 0; i < data.length; i+=categories.length) {
  var object = {};
  for (var j = 0; j < categories.length; j++) {
    object[categories[j]] = data[i + j];
  }
  
  result.push(object);
}

console.log(result);

Answer 6

Or perhaps we can try a different method :)

var categories = ["Year","Count"];
var data  = ["2005",50212,"2006",51520,"2007",52220,"2008",52143];

var result = [];
for (var i = 0; i < data.length; i+=categories.length) {
  var object = {};
  for (var j = 0; j < categories.length; j++) {
    object[categories[j]] = data[i + j];
  }
  
  result.push(object);
}

console.log(result);

Answer 7

Answer №4

Check out this code snippet that performs the task

cNames = ["Type","Quantity"];
mData  = ["Apple",50,"Banana",25,"Orange",30,"Grapes",40];

var combinedData = [];
var i = 0;
mData.forEach(function(value,index){
 if(i%2==0)
 {
   var itemToPush = {};
   itemToPush[cNames[0]] = value;
   itemToPush[cNames[1]] = mData[index + 1];
   combinedData.push(itemToPush);
 }
 i++;
});

console.log(combinedData);

Answer 8

Check out this code snippet that performs the task

cNames = ["Type","Quantity"];
mData  = ["Apple",50,"Banana",25,"Orange",30,"Grapes",40];

var combinedData = [];
var i = 0;
mData.forEach(function(value,index){
 if(i%2==0)
 {
   var itemToPush = {};
   itemToPush[cNames[0]] = value;
   itemToPush[cNames[1]] = mData[index + 1];
   combinedData.push(itemToPush);
 }
 i++;
});

console.log(combinedData);

Answer 9

Answer №5

let categories = ["Year","Count"];
let mainData  = ["2005",50212,"2006",51520,"2007",52220,"2008",52143];

let newData = [];
let numOfCategories = categories.length; 

while(mainData.length > 0)
  {
  let values = mainData.splice(0,numOfCategories);
  let tempObj = {};
  for(let j=0; j<numOfCategories; j++) tempObj[categories[j]] = values[j];
  newData.push(tempObj);
  }

console.log(JSON.stringify(newData));

Answer 10

let categories = ["Year","Count"];
let mainData  = ["2005",50212,"2006",51520,"2007",52220,"2008",52143];

let newData = [];
let numOfCategories = categories.length; 

while(mainData.length > 0)
  {
  let values = mainData.splice(0,numOfCategories);
  let tempObj = {};
  for(let j=0; j<numOfCategories; j++) tempObj[categories[j]] = values[j];
  newData.push(tempObj);
  }

console.log(JSON.stringify(newData));

Combining two arrays of names and values into a fresh object using Javascript

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Similar questions

The JSColor onChange event is throwing an error indicating that the function is not defined

Utilize Vue.js to transmit HTTP requests with specified headers and parameters

Execute a JavaScript function prior to initiating an AJAX request

The variable is unable to be accessed within the PHP function query

Exploring the functionalities of Express and Socket.io

Using jQuery to retrieve the values of two distinct sliders and executing a specific mathematical operation

Updating contact list to a database table structure

Will the rel attribute work in all web browsers and with all HTML tags?

Identifying modifications in json file within Ansible can be problematic when using jq due to variations in indentation, resulting in the file always being marked as

The function toJson() does not exist for the specified stdClass object

The current status of an ASP.Net Mvc Ajax request

Fixing blurry text on canvas caused by Arbor.js mouse event issues

When clicked, elevate the element to the top of the window with an offset

Introducing a fresh parameter to initiate and end Server Sent Events

Performing optimized searches in Redis

Role Based Routing in React allows for different paths and components

The DELETE request in my app using React Native and Fetch API is experiencing difficulties, although it is successfully working when tested in

Creating an attractive image carousel using jQuery or YUI for your website

The issue of excessive recursion in Typescript

Creating dynamic cubes in Magento with interact.js within a .phtml template