JS对大量数据的多重过滤方法

序

主要需求是前端通过Ajax从后端获取大量数据，需要根据一些条件进行过滤。第一种过滤方法如下：

Filter类{ filterA(s) {让数据=this . Filter data | | this . data；this . filter data=data . filter(m=m . a===s)；}个筛选器{让数据=this . filter data | | this . data；this . filter data=data . filter(m=m . b===s)；}}我现在很迷茫。我觉得这样处理数据是不对的，但是不知道怎么处理。

发现问题

问题在于过滤，可以实现多次过滤(先调用filterA()再调用filterB())，但这种过滤是不可逆的。

如果过滤过程如下所示：

f . Filter a(' a1 ')；f . FIlter b(' B1 ')；f . Filter a(' a2 ')；最初，我想通过‘a1’和‘B1’过滤数据，然后将第一个条件修改为‘a2’，但结果变成了一个空集合。

解决问题

如果发现问题，会相应解决。因为这个问题是由不可逆的过滤过程引起的，所以可以通过每次直接从this.data而不是this.filterData中过滤来解决。如果您想这样做，您需要先记录所选的过滤条件。

记录过滤条件

用列表记录过滤条件当然是可行的，但要注意的是，同一条件的两个过滤器是互斥的，只能保留最后一个，所以用HashMap更合适。

类Filter { constructor(){ this . filters={ }；} set(key，filter){ this . filters[key]=filter；} getFilters(){ return object . keys(this . filters)。map(key=this . filters[key])；}}在这种情况下，类似上述的过程表示为

f.set('A '，m=m . A===' a1 ')；f.set('B '，m=m . B===' B1 ')；f.set('A '，m=m . A===' a1 ')；let filters=f . GetFilters()；//长度===2；上面第三句中的过滤器集覆盖了第一句中的过滤器集。现在，依次用最后的过滤器过滤原始数据，你可以得到正确的结果。

有人认为getFilters()返回的列表不是集合顺序的——。的确，这是HashMap的特点，它是无序的。但是，对于简单条件的判断，不管谁先来，结果都是一样的。但是，对于某些复合条件，可能会有影响。

如果真的有必要，我们可以用数组代替地图来解决序列的问题，但是搜索效率会降低(线性搜索)。如果想解决搜索效率的问题，可以用数组映射来处理。这里就不多说了。

过滤器

事实上，在使用它时，每次用另一个循环处理getFilter()真的很慢。由于数据被封装在filter中，您可以考虑直接给出Filter()方法来传递过滤器接口。

Filter类{ Filter(){ let data=this . data；for(让f of this . getfilters()){ data=data . filter(f)；}返回数据；}}但是我觉得效率不是很好，尤其是对于大量的数据。利用洛达什的延迟处理。

用洛达什延迟加工

filter(){ let chain=_(this . data)；for(让f of this . getfilters()){ chain=chain . filter(f)；} return chain . value()；}当数据大于200时，lodash将启用延迟处理，也就是说，它将在循环中依次调用每个过滤器，而不是对每个过滤器执行循环。

延迟处理和非延迟处理的区别可以从下图中看出。总的来说，非延迟处理将执行n(这里，n=3)个大周期，产生n-1个中间结果。但是延迟处理只会经历一个大循环，不会产生中间结果。

但是说实话，我不喜欢为了一点小事就多加载一个库，所以我就自己做了一个简单的实现

自己实现延迟处理

filter(){ const filters=this . getfilters()；返回数据。filter(m={ for(let f of filters){//如果一个过滤器已经过滤掉它，就不再需要判断if(！f(m)) {返回false} }返回true});}内部的for循环也可以通过Array.prototype来简化。

filter(){ const filters=this . getfilters()；return data . filter(m={ return filters . every(f=f(m))；});}数据过滤其实并不是一件复杂的事情，只要思路清晰，需要保留哪些数据，哪些数据是暂时的(中间过程)，哪些数据是最终的结果……使用Array.prototype中的相关方法或者lodash等工具就可以轻松处理。

摘要

以上就是本文的全部内容。希望本文的内容对大家的学习或工作有所帮助。有问题可以留言交流。