通过基于Javascript中第一个数组的元素进行分组来合并两个数组

Posted

技术标签:

【中文标题】通过基于Javascript中第一个数组的元素进行分组来合并两个数组【英文标题】:Merge two arrays by grouping based on elements of 1st array in Javascript 【发布时间】:2016-06-12 03:20:26 【问题描述】:

我有两个这样的数组(arr1 和 arr2)

var arr1 = ["A","B","C"];

var arr2 = [["A","aa"], ["A","ab"], ["A","ac"],["B","ba"],["B","bb"],["B","bc"],["C","ca"],["C","cb"]];

我想根据第一个数组的值将它们组合成 javascript 中的第三个数组。期望的输出:

arr3 = [ ["A",["aa","ab","ac"]], ["B",["ba","bb","bc"] ], ["C",["ca","cb"]] ]

注意:我从 arr2 开始,并且能够检索第一个值并将重复项删除到 arr1。

请指教。

【问题讨论】:

【参考方案1】:

这样试试

var arr1 = ["A", "B", "C"];

var arr2 = [
  ["A", "aa"],
  ["A", "ab"],
  ["A", "ac"],
  ["B", "ba"],
  ["B", "bb"],
  ["B", "bc"],
  ["C", "ca"],
  ["C", "cb"]
];
var newVal = arr1.map(function(x) 
  var filter = arr2.filter(function(y) 
    return y[0] == x;
  ).map(function(y) 
    return y[1];
  );
  return [x, filter];
)
console.log(newVal);

DEMO

【讨论】:

【参考方案2】:

注意:我从 arr2 开始,并且能够检索第一个值并将重复项删除到 arr1。

与其创建arr1 作为中间步骤,我可能会创建一个对象作为中间步骤:

var obj = arr2.reduce(function(a,b)
  if (!a[b[0]]) a[b[0]] = [];
  a[b[0]].push(b[1]);
  return a;
,);

// obj is now "A":["aa","ab","ac"],"B":["ba","bb","bc"],"C":["ca","cb"]

将该对象转换为所需的输出数组:

var arr3 = Object.keys(obj).map(function(v)  return [v, obj[v]]; );
// [["A",["aa","ab","ac"]],["B",["ba","bb","bc"]],["C",["ca","cb"]]]

如果您确实需要 arr1 数组来做其他事情,那么:

var arr1 = Object.keys(obj);
// ["A", "B", "C"]

但请注意,obj 对于进一步处理非常有用,因为如果您需要获取与 "B" 关联的值,则无需再次搜索数组,您可以简单地说 obj["B"](其中将给出数组["ba","bb","bc"])。所以第二个"B" 值是obj["B"][1]

进一步阅读:

.reduce() .map() Object.keys()

【讨论】:

以上是关于通过基于Javascript中第一个数组的元素进行分组来合并两个数组的主要内容,如果未能解决你的问题,请参考以下文章

javascript怎样删除一个html元素

JavaScript基础篇分享之三

Leetcode 215数组中第k个最大的元素

求数组中第K个最大的值

JavaScript选择排序

JavaScript:自动对可变多维数组进行对角排序