使用 javascript 或 Lodash 将数组值添加到一个 json 对象中答案

【问题标题】：Add array values into one json object using javascript or Lodash使用 javascript 或 Lodash 将数组值添加到一个 json 对象中
【发布时间】：2017-03-01 15:05:00
【问题描述】：

我在网上搜索并阅读了 Lodash 文档，但找不到快速解决此问题的方法。

基本上，我有两个数组

var employee = ["John", "Mary"];
var location = ["APAC", "singapore"];

最终我希望有一个如下所示的 Json 对象：

var obj = {
   "profile": [
    {
      "name": "John",
      "location": ["APAC","Singapore"]
    },
    {
      "name": "Mary",
      "location": ["APAC","Singapore"]
    }
   ]
}

【问题讨论】：

为什么错过了"Mary"？
你已经尝试了什么？
进行了更正：我查看了 _.zipObject 和 _.castArray，但尚未弄清楚如何将“配置文件”、“名称”或“位置”添加到对象中

标签： javascript arrays json lodash

【解决方案1】：

不要使用location作为变量名（var location ...），因为它会与window.location对象冲突。

使用Array.prototype.reduce()函数的解决方案：

var employee = ["John", "Mary"],
    loc = ["APAC", "Singapore"],
    result = employee.reduce(function (r, e) {
        r.profile.push({"name": e, "location": loc.slice()});
        return r;
    }, {profile: []});

console.log(result);

【讨论】：

这是一个非常好的方法！
reduce 只是浪费！ map 更好！
这确实是一种不使用 for 循环的巧妙方法，谢谢！
还有一个小问题，为什么要使用 loc.slice()？如果你只是按下 loc，我看不到数组的差异
@hao，Javascript数组是通过引用传递的，你应该使用Array.prototype.slice()来推送初始数组的副本（避免进一步修改）

【解决方案2】：

您可以将_.zipWith 与 lodash 一起使用：

var employee = ["John", "Mary"];
var location = ["APAC", "singapore"];
var output = {
  profile: _.zipWith(employee, name =>  ({
    name,
    location
  }))
};

console.log(output);

【讨论】：

【解决方案3】：

要实现上述目标，您可以使用 ES2015 执行以下操作：

const employees = ["John", "Mary"];
const locations = ["APAC", "singapore"];

const final = []

employees.forEach( (employee) => {
  let obj = {
    name: employee,
    location: [...locations]
  }
  final.push(obj)
})

【讨论】：

【解决方案4】：

也许一个简单的循环就可以解决问题：

var obj = { "profile" : [] };
employee.forEach(function(e) {
    obj.profile.push({ "name": e, "location": location });
});

【讨论】：

我相信使用此解决方案无法使用该位置，因为您会得到一个圆形对象，您可以使用 ES2015 扩展运算符 [...location] 解决此问题
它可以工作，但他需要重命名 var 位置，因为它会与 window.location 冲突，如之前的答案中所述。

【解决方案5】：

这是一个使用地图和节点的快速而肮脏的解决方案：

var obj = {
  "profile": employees.map((name) => {
    return {
      "name": name,
      "location": location
    };
  })
};

【讨论】：

map 返回一个新数组，不改变原来的！
加上整个 location 数组应该附加到所有员工，而不仅仅是同一索引处的员工！