Question

我有以下对象：

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,
    },
  }
}

我现在想要的是四个包含每个人所有值的数组：

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]

我已经使用Object.values()尝试了一些方法，但此刻我完全陷入困境。我该如何实现？

Answer 1

假设每个任务的人数相等：

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);

Answer 2

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>

Answer 3

您可以使用Object.keys()来绘制地图。它用于映射对象，就像数组一样。

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)

Answer 4

您可以使用Array.reduce()和Array.forEach()来按人创建数据对象，然后对其进行解构：

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);

Answer 5

这是我会推荐的。

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)

Answer 6

有许多方法可以使用普通的旧JavaScript来实现。在下面，我使用Array.prototype.reduce方法和for...in循环构造将数据分类为地图类型结构（实际上只是一个以人员ID为键的对象）来实现它。

数据排序后，我将使用ES6解构将map分离为各个变量，然后使用这些值记录数组文字。不过，还有其他方法可以做到这一点。

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]);

从对象获取值到数组

6 个答案: