我们可以将 .filter() 函数与搜索属性的条件规则一起使用吗？答案

【问题标题】：Can we use .filter() function with conditional rules for the searched properties?我们可以将 .filter() 函数与搜索属性的条件规则一起使用吗？
【发布时间】：2019-07-26 23:22:29
【问题描述】：

假设我们有以下 .filter 函数：

search(searchQuery: string) {
  let results = myArray.filter(item => 
    item.title.toLowerCase().includes(searchQuery) ||
    item.description.toLowerCase().includes(searchQuery)
  );

  return results;
}

对于此示例，我们可以认为item 始终没有description 属性，但只有某些时候。在这种情况下，函数将失败并出现错误：

错误类型错误：无法读取未定义的属性“toLowerCase”

我们如何才能仍然在数组中进行搜索，并且仅当 description 属性存在时才将其包含在搜索中？这在.filter() 函数中是否可行？

【问题讨论】：

(item.title && item.title.toLowerCase().includes(searchQuery)) || (item.description && item.description.toLowerCase().includes(searchQuery))怎么样

标签： javascript typescript ecmascript-6 filter

【解决方案1】：

search(searchQuery: string) {
  return myarray.filter(item => 'description' in item
    ? item.description.toLowerCase().includes(searchQuery)
    : item.title.toLowerCase().includes(searchQuery)
  );
}

可能也想对title 做同样的检查，但你要走多远。

【讨论】：

【解决方案2】：

你可以取一个默认值。

直接

(item.description || '').toLowerCase().includes(searchQuery)

或使用默认值进行解构。

results = myArray.filter(({ title = '', description = '' }) => 
    title.toLowerCase().includes(searchQuery) ||
    description.toLowerCase().includes(searchQuery)
);

【讨论】：

【解决方案3】：

你可以这样做：

const myArray = [
    {
        title: 'Test 123',
    },
    {
        title: 'Test 123',
        description: 'test',
    },
    {
        title: 'What',
    },
    {
        title: 'Fix',
        description: '456123',
    },
];

const search = (text) => {
    let results = myArray.filter(item => {
        if (item.description) {
            return item.title.toLowerCase().includes(text) || item.description.toLowerCase().includes(text);
        }
    });
  
    return results;
}

const results = search('test');

console.log(results);

【讨论】：