Map对象的Javascript数组并返回满足条件的新数组

hlswsv35  于 2023-01-29  发布在  Java
关注(0)|答案(3)|浏览(380)

具有以下数据结构:

[
    {
        "items": [
            {
                "name": "View Profile",
                "href": "/profile",
                "icon": {}
            },
            {
                "name": "Manage Account",
                "href": "/manage",
                "icon": {}
            },
            {
                "name": "Other",
                "icon": {}
            }
        ]
    },
    {
        "items": [
            {
                "name": "Access",
                "href": "/access",
            },
            {
                "name": "Give Feedback",
                "href": "/feedback",
                "icon": {}
            }
        ]
    }
]

需要一个函数返回一个对象数组,该数组只包含具有namehref的元素,忽略不具有name的元素。
因此,生成的数组应该如下所示:

[
   { 
      "name": "View Profile",
      "href": "/profile"
   },
   { 
      "name": "Manage Account",
      "href": "/manage"
   }, 
   { 
      "name": "Access",
      "href": "/access"
   }, 
   { 
      "name": "Give Feedback",
      "href": "/feedback"
   }
]

我试过这样做,但没有成功:

const result = input.map(obj => obj.items).map(innerObj => innerObj.href ? ({innerObj.name, innerObj.href});
2hh7jdfx

2hh7jdfx1#

一个简单的一行程序-您将第一个Map的结果扁平化,然后过滤带有href & name的项目:

input.flatMap(({ items }) => items).filter(({ href, name }) => href && name)
jgwigjjp

jgwigjjp2#

您可以检查属性并返回一个对象或数组,以获得平面结果。

const
    data = [{ items: [{ name: "View Profile", href: "/profile", icon: {} }, { name: "Manage Account", href: "/manage", icon: {} }, { name: "Other", icon: {} }] }, { items: [{ name: "Access", href: "/access" }, { name: "Give Feedback", href: "/feedback", icon: {} }] }],
    result = data.flatMap(({ items }) =>
        items.flatMap(({ name, href }) => name && href ? { name, href } : [])
    );

console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }
pcww981p

pcww981p3#

使用flatMap()将结果展平一个级别,然后使用filter()仅获取hrefname可用的元素

const result = input.flatMap(obj => obj.items).filter(({href, name}) => href && name)

相关问题