JavaScript：如何传入指定字段数组搜索对象数组

给定如下对象数组：

const src = [ { id:1, name: "name1", age: 25}, { id: 2, name: "name2", age: 33} ]

我们需要实现一个搜索函数，支持传入字段数组（比如["name", "age"]），仅在指定字段中匹配关键词，替代原代码中硬编码字段的写法。原代码如下：

function contains(text, subStr) {
  return text.includes(subStr);
}

const searchInData = (searchString, searchData) => {
  const keyword = searchString.toLocaleLowerCase();
  let filteredData = searchData;
  if (keyword) {
    filteredData = searchData?.filter((item) => {
      const { name, age } = item;
      return (
        contains(name, keyword) ||
        contains(age, keyword) ||
      );
    });
  }
  return filteredData;
};

修改后的实现代码 #

// 统一处理匹配逻辑，兼容非字符串类型的值
const contains = (value, subStr) => {
  // 将值转为字符串后再转小写，避免数字、布尔值等类型的匹配问题
  return String(value).toLocaleLowerCase().includes(subStr);
};

const searchInData = (searchString, searchData, fieldsForSearch = []) => {
  const keyword = searchString.toLocaleLowerCase();
  // 若无关键词或无指定搜索字段，直接返回原数据
  if (!keyword || fieldsForSearch.length === 0) {
    return searchData || [];
  }
  
  return searchData?.filter((item) => {
    // 遍历指定字段数组，只要有一个字段匹配就保留当前项
    return fieldsForSearch.some((field) => {
      const fieldValue = item[field];
      return contains(fieldValue, keyword);
    });
  }) || [];
};

关键改动说明 #

• 新增参数支持：函数新增fieldsForSearch参数，并设置默认空数组，避免调用时未传参报错。
• 动态遍历字段：使用Array.some()遍历传入的字段数组，替代原硬编码的字段判断，只要有一个字段匹配关键词，就保留当前数组项。
• 类型兼容处理：修改contains函数，将字段值统一转为字符串后再做匹配，解决数字、布尔值等非字符串类型无法直接调用includes的问题。
• 边界情况处理：当关键词为空或无指定搜索字段时，直接返回原数据；处理searchData为undefined的情况，返回空数组避免报错。

调用示例 #

const src = [ { id:1, name: "name1", age: 25}, { id: 2, name: "name2", age: 33} ];

// 搜索name和age字段，匹配"name1"
console.log(searchInData("name1", src, ["name", "age"])); 
// 输出: [{ id:1, name: "name1", age: 25}]

// 仅搜索age字段，匹配"33"
console.log(searchInData("33", src, ["age"])); 
// 输出: [{ id: 2, name: "name2", age: 33}]

// 无指定字段时返回原数组
console.log(searchInData("25", src, [])); 
// 输出: 原src数组

内容的提问来源于stack exchange，提问作者lrr59