时间戳

首页 > 解决方案 > 如何使用对象条目创建对象数组？

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

问题描述

我想从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>
  }

}

在此处输入图像描述

控制台输出：

e

标签： javascriptreactjsreact-table

解决方案

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

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

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

console.log(mapped);

如果您需要一个具有相同键/值但映射了值的新对象（例如 by 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) => ...);

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

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

你应该这样写：

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

推荐阅读