javascript - 如何过滤和映射嵌套数组项，同时检查要过滤的项是否满足某些条件？

Question

我需要过滤和映射数组项和每个项的子数组项，同时检查要过滤的项是否具有满足特定条件的特定属性。

有哪些基于数组方法的良好过滤和映射嵌套数组项的方法？

必需的属性

"productName", "productCategory", "content", "id"

并且如果productImages内的status不是已链接或现有

示例数据

[
  {
    "productName": null,
    "productCategory": null,
    "productImages": [
      {
        "content": "1",
        "id": null,
        "data": null,
        "file": null,
        "url": null,
        "status": "Existing"
      },
      {
        "content": "",
        "id": "234",
        "data": "test data",
        "file": "test file",
        "url": null,
        "status": "Existing"
      }
    ]
  },
  {
    "productName": null,
    "productCategory": "hello category",
    "productImages": [
      {
        "content": "1",
        "id": null,
        "data": null,
        "file": null,
        "url": null,
          "status": "Existing"
      },
      {
        "content": "",
        "id": "234",
        "data": "test data",
        "file": "test file",
        "url": null,
          "status": "Existing"
      }
    ]
  },
  {
    "productName": "test product",
    "productCategory": "test category",
    "productImages": [
      {
        "content": "1",
        "id": "123",
        "data": "test data",
        "file": "test file",
        "url": null,
        "status": "Linked"
      },
      {
        "content": "2",
        "id": "234",
        "data": "test data",
        "file": "test file",
        "url": "test",
        "status": "Linked"
      }
    ]
  },
  {
    "productName": "new product",
    "productCategory": "new category",
    "productImages": [
      {
        "content": "2",
        "id": "32332",
        "data": "test data",
        "file": "test file",
        "url": "test",
        "status": "new"
      }
    ]
  }
]

预期输出

[
  {
    "productIndex": 3,
    "name": "new product",
    "category": "new category",
    "filteredImages": [
      {
        "newcontent": "2",
        "id": "32332",
      },
    ]
  },
]

代码

const filteredProducts = products.filter((element) => element.productName && element.productCategory);

Answer 1

您可以通过一个 for-of 循环来完成此操作:

const incomplete_items = [];
const new_data = []
for (const [index, item] of data.entries()) {
  if(item.productName && item.productCategory && item.productImages.every((image) => image.id && image.content && !['Existing', 'Linked'].includes(image.status))){
    new_data.push({
      productIndex: index,
      name: item.productName,
      category: item.productCategory,
      filteredImages: item.productImages.map((image) => ({ newcontent: image.content, id: image.id,  }))
    })
  } else {
    incomplete_items.push(index);
  }
}

工作示例

const data = [
  {
    "productName": null,
    "productCategory": null,
    "productImages": [
      { "content": "1",  "id": null, "data": null, "file": null, "url": null, "status": "Existing" },
      { "content": "","id": "234","data": "test data", "file": "test file", "url": null, "status": "Existing" }
    ]
  },
  {
    "productName": null,
    "productCategory": "hello category",
    "productImages": [
      { "content": "1", "id": null,"data": null, "file": null, "url": null, "status": "Existing"},
      { "content": "", "id": "234","data": "test data","file": "test file", "url": null, "status": "Existing" }
    ]
  },
  {
    "productName": "test product",
    "productCategory": "test category",
    "productImages": [ 
      { "content": "1", "id": "123", "data": "test data", "file": "test file", "url": null, "status": "Linked" },
      { "content": "2", "id": "234", "data": "test data", "file": "test file", "url": "test","status": "Linked" }
    ]
  },
  {
    "productName": "new product",
    "productCategory": "new category",
    "productImages": [
      { "content": "2","id": "32332", "data": "test data", "file": "test file", "url": "test", "status": "new" }
    ]
  }
]

const incomplete_items = [];
const new_data = []
for (const [index, item] of data.entries()) {
  if(item.productName && item.productCategory && item.productImages.every((image) => image.id && image.content && !['Existing', 'Linked'].includes(image.status))){
    new_data.push({
      productIndex: index,
      name: item.productName,
      category: item.productCategory,
      filteredImages: item.productImages.map((image) => ({ newcontent: image.content, id: image.id,  }))
    })
  } else {
    incomplete_items.push(index);
  }
}

if(incomplete_items.length) console.log(`Items ${incomplete_items} were missing required properties.`);
console.log(new_data);