如何在我的函数中使用多个过滤器

Question

一位同事发挥了过滤功能，可以过滤掉几杯咖啡。 它过滤掉3种东西。 强度，杯形和一天中的时刻。

目前，我只能同时进行这三项工作之一。 我似乎无法找出如何使它们全部起作用的方法。

这是使其中之一起作用的代码：

EventBus.$on('set-filter', (cupFilters) => {
  if (!cupFilters.intensities.length) {
    this.filteredOut = false;
    return;
  }
  this.filteredOut = !cupFilters.intensities.includes(this.cup.intensity);
});

我尝试添加像这样的矩过滤器：

EventBus.$on('set-filter', (cupFilters) => {
  if (!cupFilters.intensities.length || !cupFilters.moments.length) {
    this.filteredOut = false;
    return;
  }
  this.filteredOut = !cupFilters.intensities.includes(this.cup.intensity);
  this.filteredOut = !cupFilters.moments.includes(this.cup. coffee_moment_id);
});

但是，只有最后一个才起作用，只有那个起作用。

任何有关如何解决此问题的帮助将不胜感激。 如果需要，我也可以提供过滤器代码本身，但这似乎可以正常工作。

谢谢。

Answer 1

这样的事情会起作用。 虽然不确定逻辑（仅更改语法）

this.filteredOut =  (!cupFilters.intensities.length || !cupFilters.moments.length) 
    ? false
    : (!cupFilters.intensities.includes(this.cup.intensity) || !cupFilters.moments.includes(this.cup. coffee_moment_id)) ;

Answer 2

您未考虑任何先前的结果。 布尔运算在这里有帮助。

让我们从您当前正在做的事情开始：

let toFilter;
if (a) {
  toFilter = false;
  return;
}

toFilter = b;
toFilter = c;

假设a = false, b = true, c = false ，我假设您希望toFilter为true ，因为其中一个条件为true。 相反，发生的是我们看到toFilter为false 。

要了解原因，您可以看到代码不会返回，因为第一个条件为false ， if不会运行。 然后toFilter设置为true作为第二个条件是true ，但随后的前值toFilter被忽略，并且它被设置为false 。

为避免这种情况，一种可能性是使所有代码看起来像第一种情况：

let toFilter;
if (a) {
  toFilter = false;
  return;
}

if (b) {
  toFilter = true;
  return;
}

if (c) {
  toFilter = true;
  return;
}

现在，显然有一些重复的代码，但是可以正常工作。

我们可以使用布尔运算符来缩短它：

const toFilter = !a && (b || c);

请务必注意，布尔运算符会短路。 对于x && y这意味着如果x为false ，则y甚至都不会被求值。 对于x || y x || y ，如果x为true ，则不会对y进行求值，这意味着您不会出错或进行额外的计算。

为了你，

toFilter = this.filteredOut;
a = !cupFilters.intensities.length || !cupFilters.moments.length;
b = !cupFilters.intensities.includes(this.cup.intensity);
c = !cupFilters.moments.includes(this.cup. coffee_moment_id);

注意!(!x || !y)与x && y和!x || !y !x || !y与!(x && y) ，您的代码可以轻松地

const { intensities, moments } = cupFilters;
this.filteredOut = (intensities.length && moments.length)
  && !(intensities.includes(this.cup.intensity) && moments.includes(this.cup.coffee_moment_id));

随意以任何布局将其重写，以使其更易读