"过滤数组的子数组（查找子数组中包含特定 substring 的元素）"

Question

我有一个包含多个数组的数组，我想要根据搜索栏中的子字符串来显示匹配的数组。

我的代码如下：

在第一部分（未展示）中，我从搜索栏获取值，并在其前添加一个空格（以便在未输入任何内容时显示所有数组）。

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 showArrays = Arrays.filter(function (array) {
  return array.includes(searchimp);
});

这是我的过滤函数，但它仅在searchimp与子数组中的某个元素完全相同时生效。

其中 searchimp 是来自搜索栏的变量。

最后我还有一个函数（未展示），用于展示“showArrays”，并格式化每个数组的第一个元素以显示图片及其alt属性。

运行此代码时，当我输入“goodbye”时，它会返回第二个数组；但当我输入“goo”时，它不会返回任何结果。

Mat · Answer

为了搜索子字符串，您可以使用 indexOf 方法。同时，要处理嵌套数组，最好使用 some 方法。

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 searchimp = prompt('What find? ')
const showArrays = Arrays.filter(function (array) {
  return array.some(el => { // 遍历数组元素
    if (typeof el === 'string') { // 检查是否为字符串类型
      return el.indexOf(searchimp) > -1; // 如果找到子字符串，则返回 true 并停止遍历
    }
    return false;
  })
})

console.log(showArrays);

单行版本：

const showArrays = Arrays.filter(ar => ar.some(el => typeof el === 'string' ? el.indexOf(searchimp) > -1 : false))

Shaun Luttin · Answer

使用 Array.some() 方法来检查是否存在匹配项，并通过 String.includes() 进行匹配：

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 searchimp = 'goo';
const showArrays = Arrays.filter(arr => arr.some(elem => typeof elem === 'string' && elem.includes(searchimp)));

console.log(showArrays);