Question

我有一个像这样的对象数组：

var json = [ { day: '01-01-2018', hour: '00:00', value: '121' }, { day: '01-02-2018', hour: '05:24', value: '131' }, { day: '26-01-2018', hour: '00:07', value: '101' }, { day: '16-02-2018', hour: '08:02', value: '56' }, { day: '20-02-2018', hour: '12:02', value: '123' }, { day: '24-03-2018', hour: '10:11', value: '45' }];

我想将日期格式从DD-MM-YYYY更改为YYYY-MM-DD，然后将每月的总和值更改为创建图表。

我的尝试：

var mapDateVolume = [];

 for (var i = 0; i < json.length; i++)
        {
            var allDate = json[i].day;
            var oneVolume = json[i].value;
            var splitedDate = allDate.split("-");
            var newOrderY = splitedDate[2] + "-" 
            var newOrderM = splitedDate[1] + "-";
            var newOrderD = splitedDate[0];
            var newOrderAllDate = newOrderY + newOrderM + newOrderD;  

            var newOrder = {};
            newOrder[newOrderAllDate] = oneVolume;
            mapDateVolume.push(newOrder);

        }

var result = [];

        for (var i = 0; i < mapDateVolume.length; i++){

            var key = Object.keys(mapDateVolume)[i].split("-")[0] + "/";
            key += Object.keys(mapDateVolume)[i].split("-")[1];
            var value = Object.values(mapDateVolume)[i];
            var oldValue = Object.keys(result)[i] != null ? Object.keys(result)[i] : 0;

            var newResult = {};
            newResult[key] = value;
            result.push(newResult);
        }

        for (var i = 0; i < result.length; i++) {

            xAxis.push(Object.keys(result)[i]);
            yAxis.push(Object.values(result)[i]);

        }

我使用Chart.js，它可以在几天内正常工作：

 for ( var i = 0; i < jsonAll.length; i++ )
 {

   xAxis.push(json[i].day+'-'+json[i].hour);
   yAxis.push(json[i].value);

 }

我知道这笔款项有问题，因为我只看到一张空图表。不幸的是，我对JavaScript几乎没有经验。

Answer 1

首先让格式化整个集合（数据数组）。

我们需要：

日期格式： DD-MM-YYYY 至 YYYY-MM-DD 。
价值属性是字符串类型，我们需要它作为数字。

简单Array#Map：

const collection = data.map(x => ({ ...x, day: x.day.split("-").reverse().join("-"), value: Number(x.value)}));

接下来要再次使用Array#Map将 day属性替换为 Month 。

const mapDayToMonth = collection.map(x => ({...x, day: new Date(x.day).getMonth()}));

getMonth()方法根据当地时间返回指定日期的月份（从0到11）。所以，0是 1月，1是 2月 ......等等

最后一步Array#Reduce每个月的总和值：

const sumPerMonth = mapDayToMonth.reduce((acc, cur) => {
  acc[cur.day] = acc[cur.day] + cur.value || cur.value;
  return acc;
}, {})

完整示例 JSFiddle ：

const data = [ { day: '01-01-2018', hour: '00:00', value: '121' }, { day: '01-02-2018', hour: '05:24', value: '131' }, { day: '26-01-2018', hour: '00:07', value: '101' }, { day: '16-02-2018', hour: '08:02', value: '56' }, { day: '20-02-2018', hour: '12:02', value: '123' }, { day: '24-03-2018', hour: '10:11', value: '45' }];

    const collection = data.map(x => ({ ...x, day: x.day.split("-").reverse().join("-"), value: Number(x.value)}));

    console.log(collection);

    const mapDayToMonth = collection.map(x => ({...x, day: new Date(x.day).getMonth()}));

    console.log(mapDayToMonth);

    const sumPerMonth = mapDayToMonth.reduce((acc, cur) => {
      acc[cur.day] = acc[cur.day] + cur.value || cur.value; // increment or initialize to cur.value
      return acc;
    }, {})

    console.log(sumPerMonth)

有用的链接：

从JavaScript中的对象数组中每月求和值

1 个答案: