javascript - 以不可变的方式过滤作为对象属性的数组

Question

如何以不可变的方式过滤作为对象属性的数组？ 例如。

public transform(contactGroups: ContactGroup[], searchText: string): ContactGroup[] {
    if (!contactGroups) {
        return [];
    }
    if (searchText === undefined) {
        return contactGroups;
    }
    return contactGroups.filter((contactGroup: ContactGroup) => {
        return contactGroup.contacts.filter((contact: Contact) => {
            return contact.displayName && contact.displayName.toLowerCase().includes(searchText.toLowerCase())
        }).length > 0;
    });
}

在上面的示例中，contactGroup.contacts 包含数组中的所有项目，但不包含由于对象引用而过滤的结果。

如有任何帮助，我们将不胜感激。 谢谢。

function transform(contactGroups, searchText) {
        if (!contactGroups) {
            return [];
        }
        if (searchText === undefined) {
            return contactGroups;
        }
        return contactGroups.filter(function (contactGroup) {
            return contactGroup.contacts.filter(function (contact) {
                return (contact.displayName && contact.displayName.toLowerCase().includes(searchText.toLowerCase()));
            }).length > 0;
        });
    };
 
 var contactGroups = [{  
   "letter":"S",
   "contacts":[  
      {  
            "id":"173",
            "rawId":null,
            "displayName":"sam",
            "name":{  
               "givenName":"sam",
               "formatted":"sam"
            },
            "nickname":null,
            "phoneNumbers":null,
            "emails":[  
               {  
                  "id":"955",
                  "pref":false,
                  "value":"sam@xyz.com",
                  "type":"other"
               }
            ],
            "addresses":null,
            "ims":null,
            "organizations":null,
            "birthday":null,
            "note":"",
            "photos":null,
            "categories":null,
            "urls":null
      },
      {  
            "id":"1717",
            "rawId":null,
            "displayName":"Sat33",
            "name":{  
               "givenName":"Sat33",
               "formatted":"Sat33 "
            },
            "nickname":null,
            "phoneNumbers":[  
               {  
                  "id":"5521",
                  "pref":false,
                  "value":"1133",
                  "type":"work"
               }
            ],
            "emails":null,
            "addresses":null,
            "ims":null,
            "organizations":null,
            "birthday":null,
            "note":null,
            "photos":null,
            "categories":null,
            "urls":null
      },
      {  
            "id":"1712",
            "rawId":null,
            "displayName":"Server1234",
            "name":{  
               "givenName":"Server1234",
               "formatted":"Server1234 "
            },
            "nickname":null,
            "phoneNumbers":[  
               {  
                  "id":"5509",
                  "pref":false,
                  "value":"1234",
                  "type":"mobile"
               }
            ],
            "emails":null,
            "addresses":null,
            "ims":null,
            "organizations":null,
            "birthday":null,
            "note":null,
            "photos":null,
            "categories":null,
            "urls":null
      }
   ]
}]

console.log(transform(contactGroups, 'ver'))

它应该返回只有联系人对象“Server1234”的 contactGroup，因为搜索到的字符串是“ver”，但它仍然返回包含所有联系人对象的 contactGroup。

Answer 1

你可以试试这个解决方案

class ContactGroup {
    contacts: Contact[]
}
class Contact {
    displayName: string
}
function transform(contactGroups: ContactGroup[], searchText: string): ContactGroup[] {
    if (!contactGroups) {
        return [];
    }
    if (searchText === undefined) {
        return contactGroups;
    }
    return contactGroups.map((contactGroup: ContactGroup) => {
        return {
            ...contactGroup,
            contacts: contactGroup.contacts.filter((contact: Contact) => {
                return contact.displayName && contact.displayName.toLowerCase().includes(searchText.toLowerCase())
            })
        }
    }).filter((contactGroup: ContactGroup) => {
        return contactGroup.contacts.length > 0
    })
}