如何使用对象条目创建对象数组？

Question

我想从this.props.data创建一个对象数组，试图做到这一点，我无法使地图放置通常由object.entries生成的键值。

我有一个带有代码的屏幕截图，还有一些控制台日志以及它们显示的结果，而不是{_key：“ 0”}，我希望它是{numberOfElements：“ 12”}。 谢谢。

这是代码中有问题的部分

import React, { Component } from 'react';
export default class DataTable extends Component{
  render(){
    const data= Object.entries(this.props.data).map((_key,_value)=>({
      _key:String(_value)
    }));
    console.log(data)
    console.log(Object.entried(this.props.data))
    return <div></div>
  }

}

控制台输出：

Answer 1

好吧，如果您想要一个对象数组，每个对象代表原始对象的一个​​键/值对，这将为您解决问题：

original = {
 x : 2,
 y : 3,
}

mapped = Object.entries(original).map(([_key, _value]) => ({[_key]: String(_value)}));

console.log(mapped);

如果您需要一个具有相同键/值但映射了值的新对象（例如，用String()映射），那么这应该对您有用：

original = {
  x: 2,
  y: 3,
};

mapped = Object.entries(original)
         .reduce((obj, [_key, _value]) => 
           Object.assign(obj, { [_key]: String(_value) }),
           {});

console.log(mapped);

如果您需要映射对象但在数组内部，那么请将其放在数组中：

original = {
  x: 2,
  y: 3,
}

mappedInArray = [
  Object.entries(original).reduce((obj, [_key, _value]) => 
    Object.assign(obj, { [_key]: String(_value) }), {})];

console.log(mappedInArray);

---

通常来说，请注意您正在执行以下操作：

Object.entries(obj).map((_key, _value) => ...);

这是错误的，因为entry是一个成对的列表（长度为2的数组，第一项是键，第二项是值），在映射时，它们将转到您的_key参数，因此，您的_value参数将只是该键值对在条目数组中的索引。即您将获得：

_key = [<first-key>, <first-value>]; _value = 0;
_key = [<second-key>, <second-value>]; _value = 1;
...

您应该这样写：

Object.entries(obj).map(([_key, _value]) => ...);

Answer 2

您应该像这样组成一个对象：

let object = {}; object[_key] = String(_value); return object;