Get values from objects into array

Question

I have the following object:

export const data = {
  tasks: {
    "Cleaning": {
        personA: 1,
        personB: 0.5,
        personC: 0.1,
        personD: 0,
    },
    "Washing": {
        personA: 1,
        personB: 0.5,
        personC: 0.1,
        personD: 0,
    },
    "Something else": {
        personA: 1,
        personB: 0.3,
        personC: 0.2,
        personD: 0.3,
    },
  }
}

What I want to have now is four arrays that contain all values for each person:

person A = [1, 1, 1]
person B = [0.5, 0.5, 0.3]
person C = [0.1, 0.2, 0.3]
person D = [0, 0, 0.3]

I already tried some approaches with Object.values() but I'm totally stuck at the moment. How can I achieve this?

Alan Friedman · Accepted Answer · 2018-07-06 14:09:23Z

2

Assuming an equal number of people per task:

const data = {
  tasks: {
    "Cleaning": {
        personA: 1,
        personB: 0.5,
        personC: 0.1,
        personD: 0,
    },
    "Washing": {
        personA: 1,
        personB: 0.5,
        personC: 0.1,
        personD: 0,
    },
    "Something else": {
        personA: 1,
        personB: 0.3,
        personC: 0.2,
        personD: 0.3,
    },
  }
}

const tasks = Object.keys(data.tasks);

const result = Object.keys(data.tasks[tasks[0]]).reduce((acc, curr) => ({
  ...acc,
  [curr]: tasks.map(key => data.tasks[key][curr]),
}), {});

console.log(result);

answered Jul 6, 2018 at 14:09

Alan Friedman

1,61010 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

reisdev · Accepted Answer · 2018-07-06 14:11:23Z

You could do a map using Object.keys(). It's used to map Objects, just like an array.

const data = {
  tasks: {
    "Cleaning": {
      personA: 1,
      personB: 0.5,
      personC: 0.1,
      personD: 0,
    },
    "Washing": {
      personA: 1,
      personB: 0.5,
      personC: 0.1,
      personD: 0,
    },
    "Something else": {
      personA: 1,
      personB: 0.3,
      personC: 0.2,
      personD: 0.3,
    },
  }
}

const personA = [];
const personB = [];
const personC = [];
const personD = [];

Object.keys(data.tasks).map(function(key, index) {
  personA.push(data.tasks[key]["personA"]);
  personB.push(data.tasks[key]["personB"]);
  personC.push(data.tasks[key]["personC"]);
  personD.push(data.tasks[key]["personD"]);
});

console.log(personA)
console.log(personB)
console.log(personC)
console.log(personD)

Ori Drori · Accepted Answer · 2018-07-06 14:12:51Z

0

You can use Array.reduce() and Array.forEach() to create an object of data by person, and then destructure it:

const data = {"tasks":{"Cleaning":{"personA":1,"personB":0.5,"personC":0.1,"personD":0},"Washing":{"personA":1,"personB":0.5,"personC":0.1,"personD":0},"Something else":{"personA":1,"personB":0.3,"personC":0.2,"personD":0.3}}};

const result = Object.values(data.tasks).reduce((r, o) => {
  Object.entries(o).forEach(([k, v]) => {
    const target = r[k] || (r[k] = []);
    target.push(v);
  });
  
  return r;
}, {});

const { personA, personB, personC, personD } = result;

console.log(personA);
console.log(personB);
console.log(personC);
console.log(personD);

answered Jul 6, 2018 at 14:12

Ori Drori

196k32 gold badges243 silver badges233 bronze badges

Comments

Mustkeem K · Accepted Answer · 2018-07-06 14:16:22Z

Here is what I will recommend.

tasks= {
    "Cleaning": {
        personA: 1,
        personB: 0.5,
        personC: 0.1,
        personD: 0,
    },
    "Washing": {
        personA: 1,
        personB: 0.5,
        personC: 0.1,
        personD: 0,
    },
    "Something else": {
        personA: 1,
        personB: 0.3,
        personC: 0.2,
        personD: 0.3,
    },
  }
  var personA =[];
  var personB =[];
  var personC =[];
  var personD =[];

  Object.keys(tasks).map(function(item, index){      
    personA.push(tasks[item].personA)
    personB.push(tasks[item].personB)
    personC.push(tasks[item].personC)
    personD.push(tasks[item].personD)   
  })
 
    console.log(personA)
    console.log(personB)
    console.log(personC)
    console.log(personD)

Tom O. · Accepted Answer · 2018-07-06 14:31:14Z

There are a bunch of ways you can achieve this using plain old JavaScript. Below I achieve it using Array.prototype.reduce method and the for...in loop construct for sorting the data into a map type structure (which is really just an object keyed on person ID).

Once I have the data sorted I use ES6 destructuring to separate my map into individual variables and then log an array literal with those values. There are other ways to do this though.

const data = {
  tasks: {
    "Cleaning": {
      personA: 1,
      personB: 0.5,
      personC: 0.1,
      personD: 0,
    },
    "Washing": {
      personA: 1,
      personB: 0.5,
      personC: 0.1,
      personD: 0,
    },
    "Something else": {
      personA: 1,
      personB: 0.3,
      personC: 0.2,
      personD: 0.3,
    },
  }
}

//iterate over the values and sort them by key
var map = Object.values(data.tasks).reduce((accum, element) => {
  for (key in element) {
    if (!accum[key]) {
      accum[key] = [element[key]]
    } else {
      accum[key].push(element[key])
    }
  }
  return accum;
}, {});

//destructure the map into variables
var {
  personA,
  personB,
  personC,
  personD
} = map;

//put them into an array
console.log([personA, personB, personC, personD]);

bh4r4th · Accepted Answer · 2018-07-06 15:09:02Z

const data = {
  tasks: {
    'Cleaning': {
      personA: 1,
      personB: 0.5,
      personC: 0.1,
      personD: 0,
    },
    'Washing': {
      personA: 1,
      personB: 0.5,
      personC: 0.1,
      personD: 0,
    },
    'Something else': {
      personA: 1,
      personB: 0.3,
      personC: 0.2,
      personD: 0.3,
    },
  }
}

const getValues = (person, dataBlob) => {
  return Object.entries(dataBlob.tasks).map(
    task => {
      return task[1][`${person}`]
    }
  )
}
const personA = getValues('personA', data)
const personB = getValues('personB', data)
const personC = getValues('personC', data)
const personD = getValues('personD', data)

console.log('personA: \n', personA)
console.log('personB: \n', personB)
console.log('personC: \n', personC)
console.log('personD: \n', personD)

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

Collectives™ on Stack Overflow

Get values from objects into array

6 Answers 6

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related