JavaScript 条件切换语句答案

【问题标题】：JavaScript conditional switch statementJavaScript 条件切换语句
【发布时间】：2011-05-04 04:34:08
【问题描述】：

有没有办法在 JavaScript 中编写条件 switch 语句？

我猜不是，因为以下内容总是发送到default：

var raw_value = 11.0;
switch(raw_value)
{
    case (raw_value > 10.0):
      height = 48;
      width = 36;
      break;
    case (raw_value > 5.0):
      height = 40;
      width = 30;
      break;
    default:
      height = 16;
      width = 12;
      break;
}

如果不是，我应该使用什么来代替 - 一个长的 if/else 语句？

谢谢:)

【问题讨论】：

一个不错的解决方案是一个数组，以及这个 recent PHP question.... 的 JavaScript 版本，但这对于移植来说并非易事。
if - else 语句（if, else if, else）不会太长。相当标准（而且缩进更少）。
if/else 占用更少的空间，更容易阅读，更少的书写，更不容易出现自我造成的错误..

标签： javascript if-statement

【解决方案1】：

在switch statement 中，switch 表达式的评估值与案例的评估值进行比较。所以这里raw_value（数字）的值与raw_value > 10.0（比较表达式）和raw_value > 5.0（比较表达式）进行比较。

因此，除非您的 case 表达式之一产生等于 11.0 的数字，或者您使用 switch 表达式 true，否则您将始终获得默认 case。

只需使用简单的if/else 代替：

var raw_value = 11.0;
if (raw_value > 10.0) {
    height = 48;
    width = 36;
} else if (raw_value > 5.0) {
    height = 40;
    width = 30;
} else {
    height = 16;
    width = 12;
}

【讨论】：

而且不需要break，它和原版一样干净。

【解决方案2】：

不，switch 语句不能像那样使用。然而，这种说法并不总是更简单。例如，switch 版本需要 15 行：

var raw_value = 11.0;
switch(raw_value) {
    case (raw_value > 10.0):
      height = 48;
      width = 36;
      break;
    case (raw_value > 5.0):
      height = 40;
      width = 30;
      break;
    default:
      height = 16;
      width = 12;
      break;
}

和“长”if/else 版本仅 11：

var raw_value = 11.0;
if (raw_value > 10.0) {
      height = 48;
      width = 36;
} else if (raw_value > 5.0) {
      height = 40;
      width = 30;
} else {
      height = 16;
      width = 12;
}

所以在你的情况下，使用第二个比第一个更好......

【讨论】：

更少的代码行并不是客观上的“更好”，因为“好代码”是主观的。可读性和易于理解是另外两个因素。我可能会补充一点，“如果目标是使用尽可能少的代码行”，这种方法会更好
根据'switch'的工作原理，第一个例子总是默认

【解决方案3】：

像这样：

var raw_value = 11.0;
switch(true) {
    case (raw_value > 10.0):
      height = 48;
      width = 36;
      break;
    case (raw_value > 5.0):
      height = 40;
      width = 30;
      break;
    default:
      height = 16;
      width = 12;
}

case 语句中的表达式将计算为true 或false，如果匹配switch 条件...瞧。 default 的作用类似于 else。

奖励：您可以通过简单地将 true 替换为 false 来反转整个逻辑。使用 if ... else if 语句，您必须单独编辑每个 if 子句。

【讨论】：

这应该是正确的答案，因为它完成了 OP 以所要求的风格提出的要求。但是，第一次看到 switch(true) 语句时，我很难过。
很高兴至少帮助了一个人。 :)
投了赞成票，应该标记为答案。大多数程序员（或者可能只是我）使用服务器语言 exp。发现 JS 实现不直观。开始评估表达式并向后工作有点奇怪！
只是一个旁注。这是一个明确的例子，不要假设 SO 分数最高的人有正确的答案。
只是一个哇 :) 这救了我的命

【解决方案4】：

不要在家里尝试，也不要太认真，这只是为了好玩……

function conditionalSwitch(value, cond, callback /* cond, callback, cond, callback, ... */ ) {
  for (var i = 1; i < arguments.length; i += 2) {
    if (arguments[i](value)) {
      arguments[i + 1](value);
      return;
    }
  }
}



function test(val) {
  let width, height;

  conditionalSwitch(val,
  
    (val) => val > 10,
    () => [height, width] = [48,36],

    (val) => val > 5,
    () => [height, width] = [40, 30],

    // Default
    () => true,
    () => [height, width] = [16, 12]
  )
  console.log(width, height);
}


test(4.9);  // 12 16
test(5.1);  // 30 40
test(10.1); // 36 48

【讨论】：

呃，这不应该在 codepen 之类的，有趣的地方！看不到它在这里的意义......
@sij_a 几年后，它出现了：D