在javascript中合并两个字典数组

Question

我有两个字典数组,看起来像这样:

var lat = [{key:"2017-09-20T11:51:32.000Z", value:50.7825333},{key:"2017-09-20T11:51:33.000Z", value:50.7826},...];
var lon = [{key:"2017-09-20T11:51:32.000Z", value:-1.3075833},{key:"2017-09-20T11:51:33.000Z", value:-1.3076},...];

你可能已经猜到一个是纬度和经度之一!

我想要一种将时间,lat,lon合并为一个数组的优雅方式.两个数组都包含相同的键(我应该检查这种情况总是如此!).

var latLon = [{time:"2017-09-20T11:51:32.000Z", lat:50.7825333, lon:-1.3075833},...]

我把一些东西放在一起工作但不漂亮(即迭代两个数组并附加到一个新的)但感觉必须有一个更时尚的方式使用Object.assign与一些不错的lamdas.我也在使用D3.js库,如果它包含任何有用的方法.

Answer 1

您可以使用Array#map方法生成新数组（假设两个数组的顺序相同）。

var lat = [{key:"2017-09-20T11:51:32.000Z", value:50.7825333},{key:"2017-09-20T11:51:33.000Z", value:50.7826}];
var lon = [{key:"2017-09-20T11:51:32.000Z", value:-1.3075833},{key:"2017-09-20T11:51:33.000Z", value:-1.3076}];


var res = lat
  // iterate over the first array
  .map(function(o, i) {
    // generate the array element
    // where get values from element and
    // get value from second array using
    // the index
    return {
      time: o.key,
      lat: o.value,
      lon: lon[i].value
    }
  })

console.log(res);

// with ES6 arrow function
var res1 = lat.map((o, i) => ({time: o.key, lat: o.value, lon: lon[i].value}))


console.log(res1);

仅供参考：如果相关数组元素的顺序不同，那么您需要通过比较时间值（可以使用Array#find方法）从第二个数组中获取元素，或者您可以生成一个哈希图来映射对象。

使用Array#find方法：

var lat = [{key:"2017-09-20T11:51:32.000Z", value:50.7825333},{key:"2017-09-20T11:51:33.000Z", value:50.7826}];
var lon = [{key:"2017-09-20T11:51:32.000Z", value:-1.3075833},{key:"2017-09-20T11:51:33.000Z", value:-1.3076}];



var res = lat
  .map(function(o) {
    return {
      time: o.key,
      lat: o.value,
      // get object by using find method
      lon: lon.find(function(o1) {
        return o1.key === o.key;
      }).value
    }
  })

console.log(res);

// with ES6 arrow function
var res1 = lat.map(o => ({
  time: o.key,
  lat: o.value,
  lon: lon.find(o1 => o1.key === o.key).value
}))

console.log(res1);

使用哈希图进行引用的更有效方法：

var lat = [{key:"2017-09-20T11:51:32.000Z", value:50.7825333},{key:"2017-09-20T11:51:33.000Z", value:50.7826}];
var lon = [{key:"2017-09-20T11:51:32.000Z", value:-1.3075833},{key:"2017-09-20T11:51:33.000Z", value:-1.3076}];

// generate reference hashmap for getting 
// value using the datetime string
var ref = lon.reduce(function(obj, o) {
  // set reference
  obj[o.key] = o.value;
  // return the reference object
  return obj;
  // set initial value as an empty object
}, {});

var res = lat
  .map(function(o) {
    return {
      time: o.key,
      lat: o.value,
      // get value from generated reference object
      lon: ref[o.key]
    }
  })

console.log(res);