防止高阶数组方法引发错误

Question

有没有办法防止在筛选时抛出错误？

当没有conversationMember时，以下函数有时会在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应该是string(因为您在上面调用.toLowerCase()(，这意味着这里的incudes不是Array.prototype.includes，而是String.prototype.includes，特别是因为self.conversationSearchTerm似乎也是一个字符串(您也在上面调用了.toLowerCase()(。

所以，问题是你在应该是string但不是的东西上使用includes。简单的修复方法是在错误时将其默认为空字符串：

return (conversationMember.Name || '').toLowerCase().includes(
(self.conversationSearchTerm || '').toLowerCase()
);

附带说明一下，您不需要var self = this;。this在过滤器中可用，因为过滤器是一个箭头函数。所以你的函数(我猜它是computed，但也可以是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。