向 Javascript 过滤器添加条件答案

【问题标题】：add condition to Javascript filter向 Javascript 过滤器添加条件
【发布时间】：2020-05-26 05:23:58
【问题描述】：

我想按姓名和/或姓氏过滤用户。但我得到了

TypeError: Cannot read property 'toLowerCase' of undefined


const users = [{name: 'john', lastname: "doe"}, {name: 'mary'}]

let searchName = "jo"
let searchLastName = ""

users.filter((user) =>
    user.name
        .toLowerCase()
        .includes(searchName.toLowerCase())

    && user.lastname
        .toLowerCase()
        .includes(searchLastName.toLowerCase())
)

如果用户有姓氏，我如何才能检查姓氏。（我知道他们总是有名字）

【问题讨论】：

这能回答你的问题吗？ Typescript: Cannot read property 'toLowerCase' of undefined

标签： javascript

【解决方案1】：

变体 A：lastName 仅检查是否设置了 lastName：

users.filter((user) =>
    user.name
        .toLowerCase()
        .includes(searchName.toLowerCase())

    && (
        !user.lastname
        || user.lastname
            .toLowerCase()
            .includes(searchLastName.toLowerCase())
    )
)

变体 B：必须设置 lastName 的附加条件：

users.filter((user) =>
    user.name
        .toLowerCase()
        .includes(searchName.toLowerCase())

    && user.lastname
    && user.lastname
        .toLowerCase()
        .includes(searchLastName.toLowerCase())
    )
)

【讨论】：

您想要 A 还是 B 取决于您的用例。两者都应该避免TypeError。
&& 和 || 表达式将其操作数计算为布尔值，因此 user.lastName 首先被转换为布尔值 (true / false)。正如 Pac0 所写，空字符串 null 或 undefined 被转换为 false，但其他值也是 Falsy values
我会选择选项 A 它适用于 !searchLastName || .... 谢谢！

【解决方案2】：

您可以使用 JS 自动布尔强制添加对变量是否存在的检查：

&& user.lastname   // This will return false if empty, null or undefined
&& user.lastname
    .toLowerCase()
    .includes(searchLastName.toLowerCase())

【讨论】：