为何在JavaScript数组过滤函数中使用query.toLowerCase()？解析代码中的第二个toLowerCase

先把你给出的代码贴出来方便参考：

var fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
function filterItems(query) {
  return fruits.filter(function(el) {
    return el.toLowerCase().indexOf(query.toLowerCase()) > -1;
  })
}
console.log(filterItems('ap')); // ['apple', 'grapes']

先说说第二个query.toLowerCase()的作用 #

这个方法的核心作用是把用户传入的查询关键词统一转换成小写形式。

为什么要给query也用toLowerCase()？ #

本质是为了实现不区分大小写的模糊搜索，提升搜索的容错性。

你看，数组里的水果名称都是小写的，但用户输入查询词时可能随手用大写，比如输入'AP'、'Ap'这类混合大小写的内容。如果不给query转小写，那el.toLowerCase()得到的小写水果名，和大写的查询词对比时，indexOf就找不到匹配——比如'apple'.indexOf('AP')会返回-1，本该被筛选出来的apple就被漏掉了。

而给query也转成小写后，不管用户输入的是大写还是混合大小写，都会统一和小写的水果名去匹配。比如用户输入'GR'，转成小写后是'gr'，就能匹配到'grapes'（转小写后是'grapes'，indexOf('gr')返回0），完全符合用户的搜索预期。

说白了就是：两个toLowerCase()配合，让搜索逻辑对大小写不敏感，不管用户怎么输入大小写组合，都能精准找到目标内容。

内容的提问来源于stack exchange，提问作者Вика Григорян