Javascript:数组中的多个过滤器

Question

我有一组项目，我希望用户能够使用多个下拉列表来过滤这些项目。在这种情况下，字符串的每个字符都有自己的过滤器。

我的问题是，一旦数组已经被过滤，如何过滤它？即我的数组，零件，[“35X”，“45X”“35L”]，如果我已经过滤到包含“3”的字符串，如何过滤到包含3和L的字符串？

    var parts = [" 35X", " 35L", " X44", " 55L", " 55X"];
    var obj8 = document.getElementById("selectOperators");
    var obj1 = document.getElementById("Series");

function getOption1() {
    var din = filterParts(obj1.options[obj1.selectedIndex].value)
    document.getElementById("other").innerHTML = din;
    }

function getOption8() {
    var ryan = filterParts(obj8.options[obj8.selectedIndex].value)
    document.getElementById("other").innerHTML = ryan;
    }

function filterParts(query) {
    return parts.filter((el) => el.toLowerCase().indexOf(query.toLowerCase()) > -1)
    } 

如果可能的话，不使用 jquery 即可实现

Answer 1

Array.prototype.filter 返回一个数组，因此您可以将后续的 .filter 调用链接到基于许多谓词的过滤器

const startsWith = s => x =>
  x.substr(0, s.length) === s
  
const endsWith = s => x =>
  x.substr(-s.length) === s
  
const data =
  ['35X', '45X', '35L']

const result =
  // chain filter calls, one after the next
  data.filter(startsWith('3')) // => [ '35X', '35L' ]
      .filter(endsWith('L'))   // => [ '35L' ]

console.log(result)
// [ '35L' ]

正如您可能怀疑的那样，链接许多 .filter 调用将创建许多中间数组结果，并将迭代一系列的每个结果。对于大型数据集，创建这些中间结果可能非常昂贵。如果您遇到这种情况，我邀请您查看transducers – 这个概念比简单的数组过滤更复杂，但您不必了解它们如何工作即可使用它们。