按日期排列组并重新映射对象

时间:2019-09-25 07:06:45

标签: javascript ecmascript-6

我要转换此数据集:

[
        {
            "id": 470830,
            "input": "MANUAL",
            "value": 10000,
            "date": "2019-09-23T08:01:09.976Z"
        },
        {
            "id": 435258,
            "input": "AUTO",
            "value": 20000,
            "date": "2019-09-23T10:01:09.976Z"
        },
        {
            "id": 435207,
            "input": "MANUAL",
            "value": 5000,
            "date": "2019-09-24T12:01:09.976Z"
        },
        {
            "id": 435208,
            "input": "AUTO",
            "value": 15000,
            "date": "2019-09-24T14:01:09.976Z"
        }
]

对此

[
        {
            "date": "2019-09-23"
            "total": 30000,
            "manual": 10000,
            "auto": 20000,
        },
        {
            "date": "2019-09-24"
            "total": 20000,
            "manual": 5000,
            "auto": 15000,
        }
]

对象按日期(而不是DateTime)分组,并重新映射为具有value道具,分别来自AUTO和MANUAL以及它们的总和。

使用JavaScript执行此操作的最有效方法是什么?

---编辑---

已删除id上已注释的转换对象

1 个答案:

答案 0 :(得分:0)

您可以这样做:

   {
  "name": "vue",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.17",
    "@fortawesome/free-brands-svg-icons": "^5.8.1",
    "@fortawesome/free-solid-svg-icons": "^5.8.1",
    "@fortawesome/vue-fontawesome": "^0.1.6",
    "axios": "^0.18.0",
    "axios-cancel": "^0.2.2",
    "core-js": "^2.6.5",
    "element-ui": "^2.8.2",
    "highcharts": "^7.1.0",
    "highcharts-vue": "^1.2.0",
    "node-sass": "^4.12.0",
    "raven-js": "^3.27.0",
    "sass-loader": "^7.1.0",
    "vis": "^4.21.0",
    "vue": "^2.6.6",
    "vue-axios": "^2.1.4",
    "vue-burger-menu": "^2.0.2",
    "vue-cookies": "^1.5.13",
    "vue-router": "^3.0.1",
    "vue-scroll-to": "^2.2.1",
    "vue-scrollto": "^2.15.0",
    "vue-tour": "^1.1.0",
    "vuex": "^3.1.1"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.3.0",
    "@vue/cli-plugin-eslint": "^3.3.0",
    "@vue/cli-service": "^3.3.0",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.8.0",
    "eslint-plugin-vue": "^5.0.0",
    "vue-template-compiler": "^2.5.21"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]
}
const data = [{"id": 470830,"input": "MANUAL","value": 10000,"date": "2019-09-23T08:01:09.976Z"},{"id": 435258,"input": "AUTO","value": 20000,"date": "2019-09-23T10:01:09.976Z"},{"id": 435207,"input": "MANUAL","value": 5000,"date": "2019-09-24T12:01:09.976Z"},{"id": 435208,"input": "AUTO","value": 15000,"date": "2019-09-24T14:01:09.976Z"}]
const result = Object
  .values(data.reduce((acc, { id, input, value, date }) => {
    const ds = date.substring(0, 10)
    acc[ds] = acc[ds] || { id, auto: 0, manual: 0, value: 0, date: ds }
    acc[ds] = {
      id: acc[ds].id,
      date: ds,
      value: acc[ds].value + value,
      manual: input === 'MANUAL' ? acc[ds].manual + value : acc[ds].manual,
      auto: input === 'AUTO' ? acc[ds].auto + value : acc[ds].auto
    }
    return acc
  }, {}))

console.log(result)