将对象数组转换为网格可读数组

Question

我正在使用 ajax 获取 json 数据。然后我想使用 griddle-react 在 Griddle 中输出它。问题是我无法将数组转换为 Griddle 可读数组。

在 ajax 获取之后，我创建了一个回调函数：

function convert(obj) {
      console.log(obj);
      Object.keys(obj).forEach(function (key) {
        let format = JSON.stringify(obj[key]);
        console.log(format);
        self.setState(() => ({ data: key[format] }));
      });
    }

第一个 console.log 输出如下所示：

{
    {
      "BTC": {
        "opening_price": "9845000",
        "closing_price": "9967000",
        "min_price": "9814000",
        "max_price": "10047000",
        "average_price": "9928071.5654",
        "units_traded": "7242.04659594",
        "volume_1day": "7242.04659594",
        "volume_7day": "73491.92898643",
        "buy_price": "9967000",
        "sell_price": "9968000"
      },
    }
}

我的函数让它看起来像这样：（第二个 console.log）：

{
    "opening_price": "9846000",
    "closing_price": "9965000",
    "min_price": "9814000",
    "max_price": "10047000",
    "average_price": "9929422.0905",
    "units_traded": "7200.46713802",
    "volume_1day": "7200.467F13802",
    "volume_7day": "73395.33311647",
    "buy_price": "9959000",
    "sell_price": "9964000"
  }

我想把它转换成下面的数组，基本上是加上name项，然后Griddle就可以读取了：

{
  "name": "BTC",
  "opening_price": "9845000",
  "closing_price": "9967000",
  "min_price": "9814000",
  "max_price": "10047000",
  "average_price": "9928071.5654",
  "units_traded": "7242.04659594",
  "volume_1day": "7242.04659594",
  "volume_7day": "73491.92898643",
  "buy_price": "9967000",
  "sell_price": "9968000"
},

我做错了什么？我确定它非常接近我想要的，但我现在无法弄清楚。

Answer 1

您可以使用 Object.entries 获取键和值。使用Object.assign制作新物件

var obj = {
  "BTC": {"opening_price": "9845000","closing_price": "9967000","min_price": "9814000","max_price": "10047000","average_price": "9928071.5654","units_traded": "7242.04659594","volume_1day": "7242.04659594","volume_7day": "73491.92898643","buy_price": "9967000","sell_price": "9968000"}
}

var newObj = Object.entries(obj).reduce((c, [i, v]) => Object.assign(c, {name: i}, v), {});

console.log(newObj);

如果你有多个键，你可以使用map

var obj = {
  "BTC": {"opening_price": "9845000","closing_price": "9967000","min_price": "9814000","max_price": "10047000","average_price": "9928071.5654","units_traded": "7242.04659594","volume_1day": "7242.04659594","volume_7day": "73491.92898643","buy_price": "9967000","sell_price": "9968000"},
  "OTH": {"opening_price": "9845000","closing_price": "9967000","min_price": "9814000","max_price": "10047000","average_price": "9928071.5654","units_traded": "7242.04659594","volume_1day": "7242.04659594","volume_7day": "73491.92898643","buy_price": "9967000","sell_price": "9968000"},
}

var newArr = Object.entries(obj).map(([i, v]) => Object.assign({}, {name: i}, v));

console.log(newArr);

不包括date属性

var obj = {
  "KNC": {"opening_price": "2731","closing_price": "2788","min_price": "2693","max_price": "2849","average_price": "2790.5368","units_traded": "3178032.25814499211673","volume_1day": "3178032.25814499211673","volume_7day": "110687333.315264505902311000","buy_price": "2783","sell_price": "2788"},
  "date": "1525269153470"
}

var newObj = Object.entries(obj).reduce((c, [i, v]) => i !== 'date' ? Object.assign(c, {name: i}, v) : c, {});

console.log(newObj);

Answer 2

你能更新你的函数以在其中包含这一行吗？

obj[key]["name"] = key

function convert(obj) {
      console.log(obj);
      Object.keys(obj).forEach(function (key) {
        obj[key]["name"] = key;
        let format = JSON.stringify(obj[key]);
        console.log(format);
        //self.setState(() => ({ bithumbData: key[format] }));
      });
    }

Answer 3

function convert(obj){
    var parentKey = Object.keys(obj)[0];//Getting parent first element key
    obj = obj[parentKey];
    var newObj = {}; //Creating new empty jason object 
    newObj['name'] = parentKey; //key apply as name element to new jason object 
    for(var key in obj) //looping each child element
        newObj[key] = obj[key]; //child applying to new jason object
    return newObj;
}
console.log(JSON.stringify(convert(obj)));

将对象数组转换为网格可读数组

convert objects array to griddle readable array

javascript

ecma

reactjs

griddle