如何在javascript中对不同的键进行分组？答案

【问题标题】：How to groupby different keys in javascript?如何在javascript中对不同的键进行分组？
【发布时间】：2020-05-12 16:16:36
【问题描述】：

我有一个对象数组，键是页面和链接，我希望最终结果按链接对页面进行分组。

我的代码是：

  let Test =[
    {page:'getting link 1', lien:['lienPage1HTTP_404V']}, 
    {page:'getting link 2', lien:['lienPage2HTTP_404V1']},
    {page:'getting link 3', lien:['lienPage3HTTP_404V3','lienPage3HTTP_404V']},
    {page:'getting link 4', lien:['lienPage4HTTP_404V4']},
  ];

  var sorted = {};
  var Last1 =[];
  var Last2 =[];

  for( var i = 0; i< Test.length;  i++ ){
    if(Test[i].lien.length>1){
      for(let k=0; k<Test[i].lien.length; k++){
        Last1.push(({lien:Test[i].lien[k], page: Test[i].page}))
      }
    } 
    else {
      Last2.push(Test[i])
    }
  }
  var Last = Last1.concat(Last2);
  for( var i = 0; i< Last.length;  i++ ){
    if( sorted[Last[i].lien] == undefined ){
      sorted[Last[i].lien] = [];
    }
    sorted[Last[i].lien].push(Last[i].page)
  }

当我尝试安慰 sorted 时，我得到：

[object Object] {
  lienPage1HTTP_404V: ["getting link 1"],
  lienPage2HTTP_404V1: ["getting link 2"],
  lienPage3HTTP_404V: ["getting link 3"],
  lienPage3HTTP_404V3: ["getting link 3"],
  lienPage4HTTP_404V4: ["getting link 4"]
}

但我希望最终的结果会是：

[object Object] {
  lienPage1HTTP_404V: ["getting link 1", "getting link 3"],
  lienPage2HTTP_404V1: ["getting link 2"],
  lienPage3HTTP_404V3: ["getting link 3"],
  lienPage4HTTP_404V4: ["getting link 4"]
}

对于每个相同的键，我们都有他的值的数组。

我该如何解决？

【问题讨论】：

lienPage1HTTP_404V 和lienPage3HTTP_404V 有不同的键名，这也可能是问题（Page1 -> Page3）

标签： javascript arrays object group-by key

【解决方案1】：

您只能取出lien 的部分字符串，并仅获取HTTP_404V' 用于分组到一个临时对象中。

var data = [{ page: 'getting link 1', lien: ['lienPage1HTTP_404V'] }, { page: 'getting link 2', lien: ['lienPage2HTTP_404V1'] }, { page: 'getting link 3', lien: ['lienPage3HTTP_404V3', 'lienPage3HTTP_404V'] }, { page: 'getting link 4', lien: ['lienPage4HTTP_404V4'] }],
    reference = {},
    grouped = {};

for (let { page, lien } of data) {
    for (let k of lien) {
        let key = k.match(/HTTP_404.*/)[0];
        if (!reference[key]) {
            reference[key] = [];
            grouped[k] = reference[key];
        }
        reference[key].push(page);
    }
}

console.log(grouped);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：

它很好用，谢谢，但是当我有多个键为 'lienPage1HTTP_404V258' 并且我从后端获取它时，如何将切片替换为 9？
这个键会发生什么？
应该引用HTTP_404的字符串

【解决方案2】：

您可以替换文本中不需要的部分并使用剩余部分。此外，您应该保留分组值的指针。

let arr =[{page:'getting link 1', lien:['lienPage1HTTP_404V']}, {page:'getting link 2', lien:['lienPage2HTTP_404V1']},{page:'getting link 3', lien:['lienPage3HTTP_404V3','lienPage3HTTP_404V']},{page:'getting link 4', lien:['lienPage4HTTP_404V4']}],
    result = arr.reduce((a, {page, lien}) => {
      lien.forEach(e => {
        let extractedPart = e.replace(/lienPage[0-9]+/, "");
        a.pointers[extractedPart] = a.pointers[extractedPart] || e;
        (a.group[a.pointers[extractedPart]] || (a.group[a.pointers[extractedPart]] = [])).push(page);
      });
      return a;
    }, {pointers: {}, group: {}}).group;

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：

【解决方案3】：

这会有所帮助：

let Test =[
    {page:'getting link 1', lien:['lienPage1HTTP_404V']}, 
    {page:'getting link 2', lien:['lienPage2HTTP_404V1']},
    {page:'getting link 3', lien:['lienPage3HTTP_404V3','lienPage3HTTP_404V']},
    {page:'getting link 4', lien:['lienPage4HTTP_404V4']},
  ];
var data={};

  Test.map(el=>{
      el.lien.map(dt=>{
          data[dt]=data[dt]?[...data[dt],el.page]:[el.page]
      })
  })
  console.log(data)

【讨论】：

【解决方案4】：

var newAr = []
Test.forEach((a,b)=>{newAr.push(a.lien)})
console.log(newAr.filter((a, b) => newAr.indexOf(a) === b))
//["lienPage1HTTP_404V,lienPage2HTTP_404V1,lienPage3HTTP_404V3,lienPage3HTTP_404V,lienPage4HTTP_404V4"]

//使用这个唯一的数组并循环遍历Test Object

使用 Object 的 Map 并循环遍历 newAr 并根据需要附加到 Object。

【讨论】：