Javascript 按属性值对数组中的对象分组

Javascript 按属性值对数组中的对象分组,javascript,arrays,Javascript,Arrays,我肯定这里已经问过类似的问题,所以如果这是多余的,我提前道歉,但我确实查找了,没有找到适合我具体需要的东西。希望有人能帮忙 我有一个PageSection数组: const sections = [ { data: { order: 0, title: "home_hero", block_type: "hero", pages: ["home"]

我肯定这里已经问过类似的问题,所以如果这是多余的,我提前道歉,但我确实查找了,没有找到适合我具体需要的东西。希望有人能帮忙

我有一个PageSection数组:

const sections = [
  {
    data: { 
      order: 0, 
      title: "home_hero", 
      block_type: "hero", 
      pages: ["home"]       
    },
  },
  {
    data: {
      order: 0,
      title: "about_hero",
      block_type: "hero",
      pages: ["about"],
    },
  },
  {
    data: {
      order: 1,
      title: "home_intro",
      block_type: "content_block",
      pages: ["home"],
    },
  },
  {
    data: {
      order: 0,
      title: "service_card1",
      block_type: "card",
      pages: ["home", "services"],
    },
  },
  {
    data: {
      order: 1,
      title: "service_card2",
      block_type: "card",
      pages: ["home", "services"],
    },
  },
  {
    data: {
      order: 2,
      title: "service_card3",
      block_type: "card",
      pages: ["home", "services"],
    },
  },
];
我想将作为卡块的每个部分组合到同一原始阵列上各自的阵列中。最终的结果是这样的:

const sections = [
  {
    data: {
      order: 0,
      title: "home_hero",
      block_type: "hero",
      pages: ["home"],
    },
  },
  {
    data: {
      order: 0,
      title: "about_hero",
      block_type: "hero",
      pages: ["about"],
    },
  },
  {
    data: {
      order: 1,
      title: "home_intro",
      block_type: "content_block",
      pages: ["home"],
    },
  },
  [
    {
      data: {
        order: 0,
        title: "service_card1",
        block_type: "card",
        pages: ["home", "services"],
      },
    },
    {
      data: {
        order: 1,
        title: "service_card2",
        block_type: "card",
        pages: ["home", "services"],
      },
    },
    {
      data: {
        order: 2,
        title: "service_card3",
        block_type: "card",
        pages: ["home", "services"],
      },
    },
  ],
];

我很确定我需要使用一些reduce、map和filter的组合,但我似乎不能对此束手无策。任何帮助都将不胜感激!谢谢大家!

我很有信心在一行中就能做到这一点,但我想不出来

但是,这里有一个2行的解决方案,可以实现您想要的:

let grouped = sections.filter(section => section.data.block_type !== "card");
grouped.push(sections.filter(section => section.data.block_type == "card"));
一行+最优

Array.prototype.concat(
sections.filter(s=>s.data.block_type!==“卡”),
sections.filter(s=>s.data.block_type==“卡”)
);

另一方面,这将创建一个新数组,该数组来自源的另外两个新数组。我不反对这个用例,但它似乎非常罕见。无论你想要什么样的最终结果,肯定有更好的方法来实现。

嘿,谢谢你的回复!我绝对愿意接受任何关于实现这一最终结果的“更好方法”的建议。想详细说明一下吗?再次感谢!嗯,这主要取决于。。这些数据来自哪里?你手工制作它。。。是crud操作,还是查询的结果?您将它输入到哪个脚本中,并且该脚本是否可以调整为在不转换数据的情况下按原样处理数据。这完全取决于您的架构,但如果是我,我需要映射==“卡”和!==“card”,我可能会给我的脚本提供一个对未更改的原始数组的引用和一个索引映射。数据来自一个github文件夹,该文件夹是通过api请求引入的。该文件夹是我站点中每个部分的平面表示,因为我不知道如何从github的AST中递归获取每个页面的数据。因此,数据肯定会更加友好。这只是我的知识和时间的限制,以便正确地使用它。为了以防万一,您或这里的任何人都有任何熟悉的地方,我正在使用octockit/rest软件包来简化请求。我想在以后的版本中,我可能会引入他们的graphql包,因为我仍然在充实这个概念这里有一个想法
const map=sections.map(s=>s.data.block_type!==“card”?0:1)将贴图与节一起馈送到脚本中,当您需要仅对满足===“block”的项执行某些操作时,例如渲染某些内容,您可以解析贴图而不是原始数组,并且可以使用贴图中的索引来拾取
节中的实际对象