使用下划线或lodash将一个JSON结构转换为另一个

时间:2018-07-27 09:39:58

标签: javascript underscore.js lodash

我在尝试将当前的JSON结构转换为另一个结构时遇到问题

var data = [
  {
    "url": "asset/01.flv",
    "pic": "asset/01.jpg"
  },
  {
    "url": "asset/02.flv",
    "pic": "asset/02.jpg"
  },
  {
    "url": "asset/03.flv",
    "pic": "asset/03.jpg"
  },
  {
    "url": "asset/04.flv|asset/05.flv|asset/06.flv|asset/07.flv|asset/08.flv",
    "pic": "asset/04.jpg|asset/05.jpg|asset/06.jpg|asset/07.jpg|asset/08.jpg"
  },
  {
    "url": "asset/09.flv|asset/10.flv",
    "pic": "asset/09.jpg|asset/10.jpg"
  }
]

我想将数据转换成这样的输出结构。
这就是我想要达到的结果的目标。

var data = [
  {
    "url": "asset/01.flv",
    "pic": "asset/01.jpg"
  },
  {
    "url": "asset/02.flv",
    "pic": "asset/02.jpg"
  },
  {
    "url": "asset/03.flv",
    "pic": "asset/03.jpg"
  },
  {
    "url": "asset/04.flv",
    "pic": "asset/04.jpg"
  },
  {
    "url": "asset/05.flv",
    "pic": "asset/05.jpg"
  },
  {
    "url": "asset/06.flv",
    "pic": "asset/06.jpg"
  },
  {
    "url": "asset/07.flv",
    "pic": "asset/07.jpg"
  },
  {
    "url": "asset/08.flv",
    "pic": "asset/08.jpg"
  },
  {
    "url": "asset/09.flv",
    "pic": "asset/09.jpg"
  },
  {
    "url": "asset/10.flv",
    "pic": "asset/10.jpg"
  }
]

对我来说很难,有人可以帮助我吗?我已经尝试了几个小时。可以使用lodash或下划线或纯JS。预先感谢。

4 个答案:

答案 0 :(得分:1)

您可以使用ssize_t process_vm_readv(pid_t pid, const struct iovec *local_iov, unsigned long liovcnt, const struct iovec *remote_iov, unsigned long riovcnt, unsigned long flags); 来做到这一点。这个想法是遍历数组,并检查Array#reduceurl的值中是否包含pic

如果是,则拆分值并将所有项目推入结果。如果不是,请按原样推|url

pic

答案 1 :(得分:1)

您可以使用Array.reduce自己进行操作。

const arr = [{
    "url": "asset/01.flv",
    "pic": "asset/01.jpg"
  },
  {
    "url": "asset/02.flv",
    "pic": "asset/02.jpg"
  },
  {
    "url": "asset/03.flv",
    "pic": "asset/03.jpg"
  },
  {
    "url": "asset/04.flv|asset/05.flv|asset/06.flv|asset/07.flv|asset/08.flv",
    "pic": "asset/04.jpg|asset/05.jpg|asset/06.jpg|asset/07.jpg|asset/08.jpg"
  },
  {
    "url": "asset/09.flv|asset/10.flv",
    "pic": "asset/09.jpg|asset/10.jpg"
  }
];

console.log(arr.reduce((tmp, {
  pic,
  url,
}) => {
  const urlSplit = url.split('|');

  return [
    ...tmp,

    ...pic.split('|').map((x, xi) => ({
      pic: x,
      url: urlSplit[xi],
    })),
  ];
}, []));

答案 2 :(得分:1)

恕我直言,您可以使用Array#reduce()做这样的事情:

var data = [{"url":"asset/01.flv","pic":"asset/01.jpg"},{"url":"asset/02.flv","pic":"asset/02.jpg"},{"url":"asset/03.flv","pic":"asset/03.jpg"},{"url":"asset/04.flv|asset/05.flv|asset/06.flv|asset/07.flv|asset/08.flv","pic":"asset/04.jpg|asset/05.jpg|asset/06.jpg|asset/07.jpg|asset/08.jpg"},{"url":"asset/09.flv|asset/10.flv","pic":"asset/09.jpg|asset/10.jpg"}];

var parsedData = data.reduce((accumulator, e) => {
  e['url'].split('|').forEach((ele, i) => {
    accumulator.push({"url":ele, "pic": e['pic'].split('|')[i]})
  })
  return accumulator;
}, [])

console.log(parsedData);

使用Underscore.js_.zip()函数的相同解决方案。

var data = [{"url":"asset/01.flv","pic":"asset/01.jpg"},{"url":"asset/02.flv","pic":"asset/02.jpg"},{"url":"asset/03.flv","pic":"asset/03.jpg"},{"url":"asset/04.flv|asset/05.flv|asset/06.flv|asset/07.flv|asset/08.flv","pic":"asset/04.jpg|asset/05.jpg|asset/06.jpg|asset/07.jpg|asset/08.jpg"},{"url":"asset/09.flv|asset/10.flv","pic":"asset/09.jpg|asset/10.jpg"}];

var parsedData = data.reduce((accumulator, e) => {
  return accumulator.concat(...(_.zip(e['url'].split('|'), e['pic']
             .split('|'))
             .map(([url, pic]) => ({url, pic}))))
}, []);

console.log(parsedData)
<script src="https://underscorejs.org/underscore-min.js"></script>

答案 3 :(得分:1)

flatmapzipWith一起使用怎么样?

const sortedData = _.flatMap(data, obj =>
    _.zipWith(
        obj.url.split("|"),
        obj.pic.split("|"),
        (url, pic) => ({url, pic})
    )
);

var data = [
  {
    "url": "asset/01.flv",
    "pic": "asset/01.jpg"
  },
  {
    "url": "asset/02.flv",
    "pic": "asset/02.jpg"
  },
  {
    "url": "asset/03.flv",
    "pic": "asset/03.jpg"
  },
  {
    "url": "asset/04.flv|asset/05.flv|asset/06.flv|asset/07.flv|asset/08.flv",
    "pic": "asset/04.jpg|asset/05.jpg|asset/06.jpg|asset/07.jpg|asset/08.jpg"
  },
  {
    "url": "asset/09.flv|asset/10.flv",
    "pic": "asset/09.jpg|asset/10.jpg"
  }
]

var res = _.flatMap(data, o=>_.zipWith(o.url.split("|"), o.pic.split("|"), (url, pic) => ({url, pic})));

console.log(res);
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script>