我有一个由构造函数创建的对象数组.这些对象比本示例具有更多的键值对.但这一切都很好,所以不相关.让我们保持简洁：)
数组示例：
let contactsArr = [
{id: 1,firstName: "Lucas",email: "lucas@fake.com"},{id: 2,firstName: "Adrian",email: "adrian@fake.com"},{id: 3,firstName: "Betrand",email: "zorro@fake.com"}
}
];
在html中,我有一个搜索字段#search.你把它弄晕了.该字段用于在联系人对象数组中搜索任何匹配值.
该字段的内容被修剪并复制到一个字符串数组中,该字符串数组除以(1个或更多)空格.
const $input = $("#search").val().toLowerCase().trim().split(/[\s]+/);
没问题.对于下一步,我想查找并返回contactArr内部的对象的任何值,这些值等于(或包含$input中的字符串的一部分).第一个版本,我想到了以下代码：
const filteredArr = contactsArr.filter(contact => {
return contact.firstName.toLowerCase().includes($input) ||
contact.email.toLowerCase().includes($input) ||
... // and more key-value pairs to check
});
当$input返回一个字符串或只有1个字符串的数组时,这种方法可以正常工作.如果数组包含更多字符串,则仅搜索和返回第一个字符串的结果.但是考虑到对象将来可能会有更多的键-值对,这也有些混乱.因此版本2：
const filteredArr = contactsArr.filter(contact => {
return Object.values(contact).some(x => {
if (typeof x === "number") x = x.toString();
return x.toLowerCase().includes($input);
});
});
版本2确实返回与版本1相同的结果,只是它比代码中列出的键值对多得多.大！！但是,当$input数组的值大于1时,第二个值仍然被忽略.经过大量的摸索和错误,我希望有人能指出我的错误.
这是版本3 ：(甚至33)：)
const filteredArr = contactsArr.filter(contact => {
return Object.values(contact).some(x => {
// contact.id number to string
if (typeof x === "number") x = x.toString();
// match with lowercase (same as $input)
x = x.toLocaleLowerCase();
// check if includes and return true or false
return $input.some(word => x.includes(word));
});
});
预期结果：目标是使所有与$input中的任何字符串匹配的联系人.
非常感谢您提供的所有提示和见解！
最佳答案
我过去所做的就是通过将所有值连接在一起来创建一个大索引字符串.然后可以在$input数组上使用Array.prototype.some()
原文链接：https://www.f2er.com/jquery/530875.htmllet contactsArr = [
{id: 1,email: "zorro@fake.com"}
];
let searchVal = 'lu rian'
const $input = searchVal.toLowerCase().trim().split(/\s+/);
const filteredArr = contactsArr.filter(contact => {
// create an index string by joining all the values
const indexString = Object.values(contact).join(' ').toLowerCase()
// now you can perform a single search operation
return $input.some(word => indexString.includes(word))
})
console.info(filteredArr)