如何過濾嵌套數組中的字符串？

Question

我正在嘗試實現一個搜索 function ，它返回在指定數組中有搜索詞的 find 。 假設一個集合有[aa,ab,aaa]，搜索詞是“a”。 在這種情況下，返回 object 以顯示。 因為數組中至少有一個字符串有'a'。

數據結構

[
  {
   name:'aa',
   searchWords:['aa','ab','bc'] <- I want to use this array for search
  },
  {
   name:'bb',
   searchWords:['bb','bc','de'] <- I want to use this array for search
  },
...
]

我試圖通過使用includes()、filter()、indexOf()來解決這個問題。 但是，當搜索詞完全匹配時，它仍然不返回任何內容或返回數據。 如何修復代碼以實現瞄准？ 先感謝您！

這部分效果很好

let filterStudents = students;
if (searchName.length > 0 && searchTag.length === 0) {
  filterStudents = students.filter((student) => {
    if (
      student.firstName.toLowerCase().includes(searchName.toLowerCase())
      || student.lastName.toLowerCase().includes(searchName.toLowerCase())
    ) {
      return true;
    }
    return false;
  });

這部分出現問題

} else if (searchName.length === 0 && searchTag.length > 0) {
  filterStudents = students.filter(
    (student) => {
      console.log(student.tags);
      student.tags.filter((tag) => {
        console.log(tag);
        tag.indexOf(searchTag) > -1;
      });
    },
  );
} else if (searchName.length > 0 && searchTag.length > 0) {
} else {
  console.log('both');
}

Answer 1

您不會從filter回調中return

作為旁注，還有String#includes ：

filterStudents = students.filter(student =>
  student.tags.some((tag) => tag.includes(searchTag))
);

Answer 2

如果只想在對應的searchTag或searchName填寫完成后搜索匹配，使用filter回調中的條件運算符來檢查是否應該進行過濾器測試：

 const students = [ { name:'aa', searchWords:['aa','ab','bc'] }, { name:'bb', searchWords:['bb','bc','de'] }, ]; const doFilter = () => { const [searchName, searchTag] = [...document.querySelectorAll('input')].map(input => input.value.toLowerCase()); const filtered = students.filter(({ name, searchWords }) => ( (searchName? name.toLowerCase().includes(searchName): true) && (searchTag? searchWords.some(word => word.toLowerCase().includes(searchTag)): true) )); code.textContent = JSON.stringify(filtered); }; window.addEventListener('change', doFilter);

 <input placeholder="searchName"> <input placeholder="searchTag"> <div> <code id="code"></code> </div>