防止高阶数组方法抛出错误

Question

有没有办法防止过滤时抛出错误？

conversationMember.Name.toLowerCase()当没有对话成员时，下面的函数有时会失败。

如果有帮助的话，这也是 Vue 应用程序中的计算属性。如果您需要更多信息，请询问！

filteredConversations() {

    var self = this;

    var filteredConvos = self.conversations;

    filteredConvos = filteredConvos.filter(conversation => {

        return conversation.MembershipData.some(conversationMember => {

            return conversationMember.Name.toLowerCase().includes(

                self.conversationSearchTerm.toLowerCase()

            );

        });

    });

    return filteredConvos;

},

Answer 1

这似乎与数组没有任何关系。从你的代码中我理解conversationMember.Name应该是 a string（因为你正在调用.toLowerCase()它），这意味着incudes这里不是Array.prototype.includes, but String.prototype.includes，特别是因为它self.conversationSearchTerm似乎也是一个字符串（你也在调用.toLowerCase()它）。所以，问题是你正在使用includes一些应该是string但不是的东西。简单的修复方法是当它为假时将其默认为空字符串：return (conversationMember.Name || '').toLowerCase().includes(  (self.conversationSearchTerm || '').toLowerCase());附带说明一下，您不需要var self = this;. this由于过滤器是一个箭头函数，因此在过滤器内可用。所以你的函数（我猜它是 acomputed但它也可以是 a method）可能如下所示：filteredConversations() {  return this.conversations.filter(c =>     c.MembershipData.some(md =>       (md.Name || '').toLowerCase().includes(        (this.conversationSearchTerm || '').toLowerCase()      )    )  );}最后一点：如果您中的任何一个conversations没有MembershipData持有数组，这仍然会失败。为了解决这个问题，您可以将其默认为动态空数组： ...   (c.MembershipData || []).some(md =>  ...正如预期的那样，任何没有数组的对话都MembershipData将被函数过滤掉（不包含在结果中） - 因为.some(condition)在空数组上调用时将返回 false。