嵌套数组子串匹配过滤问题：现有代码仅支持精确匹配需优化

原来的filter逻辑用array.includes(searchimp)只能精确匹配整个数组元素，要实现子串模糊匹配，需要遍历子数组的每个元素，针对字符串和对象分别做包含判断，同时处理大小写和空格问题。

以下是优化后的完整代码：

const Arrays = [
 [
  { text: " first ", image: "1.jpg", },
  " hello"," world"," ",
],
[
  {text: " second",image: "https://www.wikipedia.org/portal/wikipedia.org/assets/img/Wikipedia-logo-v2.png",},
  " goodbye"," world"," ",
],
[
  { text: " Salut", image: "bass.jpg", },
  " Ca va"," au revoir"," ",
],
];

// 预处理搜索输入：去首尾空格+转小写，实现不区分大小写的模糊匹配
const processedSearch = searchimp.trim().toLowerCase();

const showArrays = Arrays.filter(subArray => {
  // 检查子数组中是否有任意元素匹配搜索子串
  return subArray.some(item => {
    if (typeof item === 'string') {
      // 处理字符串元素：去空格转小写后判断是否包含子串
      return item.trim().toLowerCase().includes(processedSearch);
    } else if (item?.text) {
      // 处理带text属性的对象：检查text字段的匹配情况
      return item.text.trim().toLowerCase().includes(processedSearch);
    }
    // 其他类型元素不参与匹配
    return false;
  });
});

关键优化点说明 #

• 输入预处理：把searchimp做trim()和toLowerCase()，既解决初始空格的问题（空输入时processedSearch为空，所有元素都会匹配），又避免大小写差异导致的匹配失败（比如输入"GOO"也能找到"goodbye"）。
• 用some()替代直接includes：some()会遍历子数组的每个元素，只要有一个元素符合条件就返回true，满足“子数组包含匹配元素就保留”的需求。
• 分类型处理元素：
  • 字符串元素：同样做去空格和转小写，解决原数组中字符串带前后空格的问题（比如" goodbye"带前导空格，输入"goo"也能匹配）。
  • 对象元素：专门提取text属性做匹配，覆盖数组里的对象结构。

测试验证 #

• 输入"goo" → 返回第二个子数组
• 输入"sal" → 返回第三个子数组
• 输入"wo" → 返回前两个子数组
• 输入空格/空值 → 返回所有子数组

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