【问题标题】:Test for multiple cases in a switch, like an OR (||)测试开关中的多个案例,例如 OR (||)
【发布时间】:2011-06-28 21:57:42
【问题描述】:

当您需要在相同情况下测试a b时,您将如何使用switchcase

switch (pageid) {
  case "listing-page" || "home-page":
    alert("hello");
    break;
  case "details-page":
    alert("goodbye");
    break;
}

【问题讨论】:

标签: javascript switch-statement fall-through


【解决方案1】:

你可以使用fall-through:

switch (pageid)
{
    case "listing-page":
    case "home-page":
        alert("hello");
        break;
    case "details-page":
        alert("goodbye");
        break;
}

【讨论】:

  • 这叫做fall-through
  • 我在发布问题之前就发现了这一点,但我认为这对社区很有用,因为它在任何地方都没有得到很好的记录......谢谢@SLaks 你也回答了。
  • 嗨@kei 我知道这不是合适的地方,但你正确回答了我的最后一个问题stackoverflow.com/questions/21049005/…你想重新发布你的答案吗?
  • 我不妨澄清一点:一旦案例评估为真,就是这样。不再检查任何情况,只检查所有执行到结束的语句:即“break;”指令或开关是否终止。
  • 其他例子here in MDN docs
【解决方案2】:

由于其他答案解释了如何做到这一点而没有实际解释它的工作原理:

switch 执行时,它会找到第一个匹配的case 语句,然后执行切换后的每一行代码,直到它遇到break 语句或switch 的结尾(或@ 987654325@ 语句离开整个包含函数)。当您故意省略 break 以便下一个 case 下的代码也被执行时,这称为 fall-through。所以对于OP的要求:

switch (pageid) {
   case "listing-page":
   case "home-page":
      alert("hello");
      break;

   case "details-page":
      alert("goodbye");
      break;
} 

忘记包含break 语句是一个相当常见的编码错误,如果您的switch 没有按您预期的方式工作,您首先应该寻找它。出于这个原因,有些人喜欢在评论中说“失败”,以明确何时故意省略了 break 语句。我在下面的例子中这样做,因为它有点复杂,并展示了一些案例如何在它们失败之前包含要执行的代码:

switch (someVar) {
   case 1:
      someFunction();
      alert("It was 1");
      // fall through
   case 2:
      alert("The 2 case");
      // fall through
   case 3:
      // fall through
   case 4:
      // fall through
   case 5:
      alert("The 5 case");
      // fall through
   case 6:
      alert("The 6 case");
      break;

   case 7:
      alert("Something else");
      break;

   case 8:
      // fall through
   default:
      alert("The end");
      break;
}

您还可以(可选地)包含 default 案例,如果其他案例都不匹配,则将执行该案例 - 如果您不包含 default 并且没有案例匹配,则不会发生任何事情。您可以(可选)使用默认情况。

因此,在我的第二个示例中,如果 someVar 为 1,它将调用 someFunction(),然后您会看到四个警报,因为它经历了多个案例,其中一些案例下有警报。 someVar 是 3、4 还是 5,您会看到两个警报。如果someVar 为 7,您会看到“Something else”,如果是 8 或任何其他值,您会看到“The end”。

【讨论】:

  • //fall through 注释使我的 phpstorm 停止警告我有关 fall-through 的 switch 语句,谢谢 :)
  • 如果开关位于您调用以返回某个对象的函数中,您可以使用 return 而不是 break:switch (action.type) {案例添加:{返回新状态; } 案例删除:{ 返回新状态; } 默认值:{ 返回状态; } }
【解决方案3】:

您需要制作两个case 标签。

控件将从第一个标签传递到第二个标签,因此它们都将执行相同的代码。

【讨论】:

    【解决方案4】:

    你必须切换它!

    switch (true) {
        case ( (pageid === "listing-page") || (pageid === ("home-page") ):
            alert("hello");
            break;
        case (pageid === "details-page"):
            alert("goodbye");
            break;
    }
    

    【讨论】:

    • 这个方法很有创新性 :-) 我喜欢它。但是,由于它使用的字符比经典的“fall-through”更多,它变得不那么有趣了:)
    • @AlexLaforge 最奇怪和最具讽刺意味的是,在另一个 stackouverflow 问题中,这样的答案完全被否决了。但尽管如此,我支持这个答案并同意,这是灵活条件的好解决方案。
    【解决方案5】:

    忘记switchbreak,让我们玩if。而不是断言

    if(pageid === "listing-page" || pageid === "home-page")
    

    让我们创建几个带有案例的数组并使用Array.prototype.includes()检查它

    var caseA = ["listing-page", "home-page"];
    var caseB = ["details-page", "case04", "case05"];
    
    if(caseA.includes(pageid)) {
        alert("hello");
    }
    else if (caseB.includes(pageid)) {
        alert("goodbye");
    }
    else {
        alert("there is no else case");
    }
    

    【讨论】:

    • 我认为这不是最好的解决方案,特别是在性能方面。 .includes 比 switch case 慢得多,因此使用 if/else。最好使用带有直通的开关盒。
    【解决方案6】:

    更简洁的方式来做到这一点?

    if (["listing-page", "home-page"].indexOf(pageid) > -1)
        alert("hello");
    
    else if (["exit-page", "logout-page"].indexOf(pageid) > -1)
        alert("Good bye");
    

    您可以对具有相同结果的多个值执行此操作

    【讨论】:

      【解决方案7】:

      使用逗号分隔大小写

      switch (pageid)
      {
          case "listing-page","home-page":
              alert("hello");
              break;
          case "details-page":
              alert("goodbye");
              break;
      }
      

      【讨论】:

      • 这不起作用的原因是因为case "listing-page","home-page": 等价于case "home-page":(因为"listing-page","home-page" is just an expression 评估为"home-page")。
      猜你喜欢
      • 2019-07-22
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-10-09
      • 1970-01-01
      • 2019-05-20
      • 2018-12-06
      相关资源
      最近更新 更多