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

我在尝试将当前JSON结构转换为另一个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是可以的。提前感谢。

您可以使用

数组#reduce

来完成。其思想是在数组上循环，检查

url

和

pic

的值中是否有

|

如果是，则拆分该值并将所有项推送到结果。如果没有，请按原样按

url

和

pic

[代码>代码>var数据={{{代码>var数据={{{代码>VA代码>var数据={{{代码>代码>代码>VAP数据={{{{代码>VA数据数据={{{{“url”网址：资产/01.flv，01.flv，pic：，，，{{{代码：[网址：：[网址：：：[网址：：“资产/资产/01.01.01.01.flv/02.flv，，，，，，，，，，，，，，，，，”，“pic：：“pic：，，，，，，，，，[代码：，，，{{{{{{{{”网址：，[网址：资产/资产/资产/资产/资产/资产/03.03.03.03.03.flv/03.03.flv/03.flv/03.flv.flv.flv/03.flv/03.flv.flv.flv，以及09.flv |资产/10.flv，“pic”：“asset/09.jpg | asset/10.jpg”}]； var result=data.reduce（（r，{url，pic}）=>{ if（url.includes（'|'）和&pic.includes（'|'））{ var url=url.split（“|”）； var pics=pic.split（“|”）； url.forEach（（u，i）=>{ r、 推送（{url:u，pic:pics[i]}）； }); }否则{ r、 推送（{url，pic}） } 返回r； }, []);

---

console.log（result）；您可以使用

数组。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{
照片，
网址，
}) => {
const urlspit=url.split（“|”）；
返回[
…tmp，
…pic.split（“|”）.map（（x，xi）=>({
图:十,，
url:URLSPILT[xi]，
})),
];
}，[]）；

IMHO，您可以使用以下方法执行类似操作：

[代码>代码>var数据={{{代码>var数据={{{代码>VA代码>var数据={{{代码>代码>代码>VAP数据={{{{代码>VA数据数据={{{{“url”网址：资产/01.flv，01.flv，pic：，，，{{{代码：[网址：：[网址：：：[网址：：“资产/资产/01.01.01.01.flv/02.flv，，，，，，，，，，，，，，，，，”，“pic：：“pic：，，，，，，，，，[代码：，，，{{{{{{{{”网址：，[网址：资产/资产/资产/资产/资产/资产/03.03.03.03.03.flv/03.03.flv/03.flv/03.flv.flv.flv/03.flv/03.flv.flv.flv，以及09.flv |资产/10.flv，“pic”：asset/09.jpg | asset/10.jpg“}]； var parsedData=data.reduce（（累加器，e）=>{ e['url'].split（'|'）.forEach（（ele，i）=>{ 累加器.push（{“url”：ele，“pic”：e['pic'].split（'|'）[i]}） }) 回流蓄能器； }, [])

---

console.log（parsedData）；简单地使用

flatmap

和

zipWith

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

var数据=[
{
“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（数据，o=>..zipWith（o.url.split（“|”），o.pic.split（“|”），（url，pic=>（{url，pic}））；
console.log（res）；

---

我认为这是最优雅的方法。也许你可以使用一个合适的代码块来修复缩进？因为一行很难理解。嘿，谢谢@tokland，基本上我还没有格式化，因为我只使用了两个函数flatMap和zipWith，只是执行了一个非常必要的拆分。在你建议之后，我尝试了一个格式化程序，which用最后一个返回语句（{url，pic}）将其拆分为另一行。如果您觉得该行的某些格式更适合更好地理解，则可以进行编辑，这将有助于其他人：）完成！如果您不喜欢这么多换行符，请随意还原它；）选中

flatMap

，

reduce

应该是在没有其他更高级别抽象工作时的最后手段。