将数组过滤到另一个数组中

Question

解释我的情况我想过滤我对 API 的响应，那是返回一个数组来提出这个问题我拿这个测试数据

此 prodPrueba 模拟用户选择的产品和变体

let prodPrueba = [
  {
    id: "B801278",
    variation: "B801278-18",
  },

  {
    id: "PC002",
    variation: "PC002",
  },
];

id 是所选产品的代码，变体是用户为产品选择的变体，例如...鞋子是产品，尺寸 18 是变体 B801278-18

这是我后端的响应

        let dataResponse = [
  {
  codProduct: "PC002",
  created_at: "2021-01-19T11:28:06.000000Z",
  desc: null,
  html_description: null,
  html_short_description: null,
  id_kit: null,
  kit: [],
  manufacturer: null,
  material: null,
  name: "Kit de Limpeza",
  id: "PC002",
  status: "active",
  tags: null,
  theme: null,
  title: null,
  type: null,
  variations: 
  [
    {
      product: "PC002", 
      cod: "U", 
      sku: "U", 
      product_sku: "PC002", 
      price: 96000,
    }
  ]

  },
  {
    codProduct: "ENG792015_9",
    created_at: "2021-01-19T11:27:59.000000Z",
    desc: null,
    html_description: null,
    html_short_description: null,
    id_kit: null,
    kit: [],
    manufacturer: null,
    material: null,
    name: "Charm en Plata.",
    id: "ENG792015_9",
    status: "active",
    tags: null,
    theme: null,
    title: null,
    type: null,
    variations: [
      {
        cod: "U",
        product: "ENG792015_9",
        product_sku: "ENG792015_9",
        price: 415000,
        sku: "U"
      }
    ]
  },
  {
    codProduct: "B801278",
    created_at: "2021-01-19T11:27:30.000000Z",
    desc: null,
    html_description: null,
    html_short_description: "Set de Regalo Brazalete en Plata Clip",
    id_kit: null,
    kit: [],
    manufacturer: null,
    material: null,
    name: "Set de Regalo Brazalete en Plata, Clip",
    id: "B801278",
    status: "active",
    tags: null,
    theme: null,
    title: null,
    type: null,
    variations: [
      {
        cod: "U",
        price: 950000,
        product: "B801278",
        product_sku: "B801278",
        sku: "U"
      },
      {
        cod: "20",
        price: 950000,
        product: "B801278",
        product_sku: "B801278-20",
        sku: "U",
      },
      {
        cod: "19",
        price: 950000,
        product: "B801278",
        product_sku: "B801278-19",
        sku: "U",
      },
      {
        cod: "18",
        price: 950000,
        product: "B801278",
        product_sku: "B801278-18",
        sku: "U",
      },
      
    ]
  }
]

正如您在 object“prodPrueba”中看到的那样，我有 2 个 id 与返回 API 的产品一致，在 prodPrueba 中，我有一个名为“variation”的属性，这与每个产品返回的变化的“product_sku”一致api。 我想过滤响应以获取除 prodPrueba 中的所有变化之外的所有变化，我尝试使用过滤器 map，forEach 并且我不知道该怎么做，有什么建议吗？

Answer 1

https://jsfiddle.net/par7hu5s/

 // Test data setup const prodPrueba = [ { id: "B801278", variation: "B801278-18", }, { id: "PC002", variation: "PC002", }, ]; let dataResponse = [ { codProduct: "PC002", created_at: "2021-01-19T11:28:06.000000Z", desc: null, html_description: null, html_short_description: null, id_kit: null, kit: [], manufacturer: null, material: null, name: "Kit de Limpeza", id: "PC002", status: "active", tags: null, theme: null, title: null, type: null, variations: [ { product: "PC002", cod: "U", sku: "U", product_sku: "PC002", price: 96000, } ] }, { codProduct: "ENG792015_9", created_at: "2021-01-19T11:27:59.000000Z", desc: null, html_description: null, html_short_description: null, id_kit: null, kit: [], manufacturer: null, material: null, name: "Charm en Plata.", id: "ENG792015_9", status: "active", tags: null, theme: null, title: null, type: null, variations: [ { cod: "U", product: "ENG792015_9", product_sku: "ENG792015_9", price: 415000, sku: "U" } ] }, { codProduct: "B801278", created_at: "2021-01-19T11:27:30.000000Z", desc: null, html_description: null, html_short_description: "Set de Regalo Brazalete en Plata Clip", id_kit: null, kit: [], manufacturer: null, material: null, name: "Set de Regalo Brazalete en Plata, Clip", id: "B801278", status: "active", tags: null, theme: null, title: null, type: null, variations: [ { cod: "U", price: 950000, product: "B801278", product_sku: "B801278", sku: "U" }, { cod: "20", price: 950000, product: "B801278", product_sku: "B801278-20", sku: "U", }, { cod: "19", price: 950000, product: "B801278", product_sku: "B801278-19", sku: "U", }, { cod: "18", price: 950000, product: "B801278", product_sku: "B801278-18", sku: "U", }, ] } ] // First, we create an array of the current variation codes held in prodPrueba const currentVariations = prodPrueba.map(p => p.variation); // A reduce function is good if you need to drop products which have no variations after filtering dataResponse = dataResponse.reduce((acc, curr) => { curr.variations = curr.variations.filter(v => { // Filter out any skus that are already in currentVariations return currentVariations.includes(v.product_sku) === false; }) // Optional step to remove products with no variations, otherwise just push without the 'if' part if (curr.variations.length > 0) acc.push(curr); return acc; }, []) console.log(dataResponse);

如果过滤后没有可用的变化，我不知道你是否想完全放弃产品（似乎你可能会），但我已经记录了如何以任何一种方式调整它。

注意：如果您以前没有使用过 reduce function，它最初可能会让人不知所措，但它绝对值得学习。

Answer 2

你能检查一下吗？

 let prodPrueba = [ { id: "B801278", variation: "B801278-18", }, { id: "PC002", variation: "PC002", }, ]; let dataResponse = [ { codProduct: "PC002", created_at: "2021-01-19T11:28:06.000000Z", desc: null, html_description: null, html_short_description: null, id_kit: null, kit: [], manufacturer: null, material: null, name: "Kit de Limpeza", id: "PC002", status: "active", tags: null, theme: null, title: null, type: null, variations: [ { product: "PC002", cod: "U", sku: "U", product_sku: "PC002", price: 96000, } ] }, { codProduct: "ENG792015_9", created_at: "2021-01-19T11:27:59.000000Z", desc: null, html_description: null, html_short_description: null, id_kit: null, kit: [], manufacturer: null, material: null, name: "Charm en Plata.", id: "ENG792015_9", status: "active", tags: null, theme: null, title: null, type: null, variations: [ { cod: "U", product: "ENG792015_9", product_sku: "ENG792015_9", price: 415000, sku: "U" } ] }, { codProduct: "B801278", created_at: "2021-01-19T11:27:30.000000Z", desc: null, html_description: null, html_short_description: "Set de Regalo Brazalete en Plata Clip", id_kit: null, kit: [], manufacturer: null, material: null, name: "Set de Regalo Brazalete en Plata, Clip", id: "B801278", status: "active", tags: null, theme: null, title: null, type: null, variations: [ { cod: "U", price: 950000, product: "B801278", product_sku: "B801278", sku: "U" }, { cod: "20", price: 950000, product: "B801278", product_sku: "B801278-20", sku: "U", }, { cod: "19", price: 950000, product: "B801278", product_sku: "B801278-19", sku: "U", }, { cod: "18", price: 950000, product: "B801278", product_sku: "B801278-18", sku: "U", }, ] } ] let filteredData = [] dataResponse.forEach(x => { let found = prodPrueba.find(y => y.id == x.codProduct) if (found) { x.variations = x.variations.filter(z => z.product_sku.= found.variation) if (x.variations.length.= 0) { filteredData;push(x) } } else { filteredData.push(x) } }); console.log(filteredData);