替换“||” Javascript 中的条件答案

【问题标题】：Replacing "||" Conditionals in Javascript替换“||” Javascript 中的条件
【发布时间】：2019-03-05 20:00:09
【问题描述】：

好吧，这是我的第一个堆栈溢出帖子！

大家好，最近学习了很多函数式编程。我在funfunfunction 找到了一些较旧的视频，这激起了我的胃口，我一直在玩它们。

我的问题是……有没有更好/不同/首选的方式来重构这段代码：

if ( bodyClasses.contains("first-class") || bodyClasses.contains("second-class") || bodyClasses.contains("third-class") ) {
        pages.filter((page) => searchAndReplace( page.postType, ".selector" ));
}

我尝试使用reduce()，但很快了解到我需要在第一次迭代返回true 时过早地中断reduce。我觉得 if 语句在这里很有意义，但我只是好奇。

我知道这是一小段没有上下文的代码，但问题在于概念而不是功能。

对于任何回复的人，我提前感谢您！

【问题讨论】：

不确定 .contains 究竟做了什么，但如果它可以接受一个数组：bodyClasses.contains(["first-class", "second-class","third-class"])
什么是bodyClasses？
@SpeedOfRound @chazsolo bodyClasses 是 document.querySelector("body").classList

标签： javascript if-statement higher-order-functions or-operator or-condition

【解决方案1】：

要摆脱 or，匹配 .some 数组值：

if(["first-class", "second-class", "third-class"].some(cls => bodyClasses.contains(cls)))
 /*...*/;

如果你没有对返回的值做任何事情，我不会使用.filter，那么只需使用.forEach。

【讨论】：

【解决方案2】：

归根结底，|| 可能需要在某个地方，但也许我们可以把它们藏起来。我喜欢在我的 if 子句中使用谓词来增加可读性并创建可重用的函数。

const hasSupport = classes =>
  classes.some(cls => cls === "class1" || cls === "class2" || cls === "class3");

if (hasSupport(bodyClasses)) { ... }

要考虑的最后一部分是在您的 if 语句中。该过滤器将返回一个新列表，但您不会将数据存储在任何地方。因此，如果您确实想要一个新列表，请将其存储在一个变量中：

const supportedPages = hasSupport(bodyClasses) 
  ?  pages.filter(...) 
  : []

如果您想要这些副作用，请使用 forEach 循环：

if (hasSupport(bodyClasses) { pages.forEach(...) }

【讨论】：