按照每个索引对象的值从多维数组中创建数组。

Question

以下是我的主要数组示例：

[
  {
    'data': [{'value': 'Red'}, {'value': 'Small'}, {'value': 'Good'}]
  },
  {
    'data': [{'value': 'Black'}, {'value': 'Medium'}, {'value': 'Bad'}]
  },
  {
    'data': [{'value': 'White'}, {'value': 'Large'}, {'value': 'Best'}]
  }
]

And I want as output:

[
  ['Red', 'Black', 'White'],    // all values from first index of data array
  ['Small', 'Medium', 'Large'], // all values from second index of data array
  ['Good', 'Bad', 'Best']       // all values from third index of data array
]

我已经尝试使用forEach、for...in、filter等方法，但是我没有成功地得到之前的输出。

- Imran

---

嗨！请仔细阅读[帮助]，特别是如何提出一个好问题？ 在这里，你最好的选择是进行研究，在SO上搜索相关主题，并尝试一下。如果你卡住了，即使做了更多的研究和搜索也无法解决问题，请发布一个[mcve]，并明确说明你卡在哪里。人们会很乐意帮助你。 - T.J. Crowder

@T.J.Crowder，感谢您的评论。下次我会分享我的代码。我已经得到了答案。所以下次当然会分享我的代码。 - Imran

Answer 1

您可以使用reduce()，然后在reduce循环中使用forEach()。在forEach循环中使用索引确定要推入哪个数组。如果该索引处尚无值，请创建一个新数组并将其推入其中：

let data = [{'data': [{'value': 'Red'},{'value': 'Small'},{'value': 'Good'}]},{'data': [{'value': 'Black'},{'value': 'Medium'},{'value': 'Bad'}]},{'data': [{'value': 'White'},{'value': 'Large'},{'value': 'Best'}]}]

let arr = data.reduce((arr, item) => {            // look at each item in the data array
  item.data.forEach(({value}, index) => {         // look at each item in the item.data array
    (arr[index] || (arr[index] = [])).push(value) // create and array if necessary and push value into it
  })
  return arr
},[])

console.log(arr)

- Mark

---

我喜欢这个，reduce 也是我的首选，+1。 - Shidersz

Answer 2

您也可以尝试以下示例。

filter() 方法基本上用于根据某些条件筛选输出。

var a = [
    {
       'data': [
       {
          'value': 'Red'
       },
       {
        'value': 'Small'
       },
      {
        'value': 'Good'
       }
     ]
    },
    {
        'data': [
        {
        'value': 'Black'
        },
        {
        'value': 'Medium'
        },
       {
        'value': 'Bad'
       }
     ]
   },
     {
     'data': [
      {
        'value': 'White'
      },
      {
        'value': 'Large'
      },
      {
        'value': 'Best'
      }
      ]
     }
    ]


var obj = {};

for(var o of a) {
    for(var i in o.data) {
        if(obj[i] === undefined) {
            obj[i] = [o.data[i].value];
        } else {
            obj[i].push(o.data[i].value);
        }
    }
}

console. log(obj);
/*
{ '0': [ 'Red', 'Black', 'White' ],
  '1': [ 'Small', 'Medium', 'Large' ],
  '2': [ 'Good', 'Bad', 'Best' ] }
*/

- hygull

---

嗨@hygull，结果显示了多次。 - jvk

这不是期望的结果（['红色'，'黑色'，'白色'] ...等）。 - Mark

现在我已经更新了我的答案。感谢您指出我的错误。 - hygull

Answer 3

这是我针对你的问题提出的解决方案，使用一个主循环来读取不同属性的数量，并在每个循环内部使用该方法提供的工具 Array.from()。

let a = [
    {'data': [{'value': 'Red'}, {'value': 'Small'}, {'value': 'Good'}]},
    {'data': [{'value': 'Black'}, {'value': 'Medium'}, {'value': 'Bad'}]},
    {'data': [{'value': 'White'}, {'value': 'Large'}, {'value': 'Best'}]}
];

// The new array.
let newArr = [];

// Number of properties for each "data" object.
let keys = 3;

for (let k = 0; k < keys; k++)
{
    newArr.push(Array.from(a, v =>  v.data[k].value));
}

console.log(newArr);

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

或者，您可以使用map()替换Array.from()，如下所示：

for (let k = 0; k < keys; k++)
{
    newArr.push(a.map(v => v.data[k].value));
}

例子：

let a = [
    {'data': [{'value': 'Red'}, {'value': 'Small'}, {'value': 'Good'}]},
    {'data': [{'value': 'Black'}, {'value': 'Medium'}, {'value': 'Bad'}]},
    {'data': [{'value': 'White'}, {'value': 'Large'}, {'value': 'Best'}]}
];

// The new array.
let newArr = [];

// Number of properties for each "data" object.
let keys = 3;

for (let k = 0; k < keys; k++)
{
    newArr.push(a.map(v =>  v.data[k].value));
}

console.log(newArr);

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

- Shidersz