JavaScript 条件切换语句

IT技术 javascript if-statement
2021-02-25 07:42:32

有没有办法在 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 语句?

谢谢 :)

4个回答

像这样:

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语句中的表达式将计算为trueor false,如果它与switch条件匹配......瞧。default就像一个else

奖励:您可以通过简单地替换true来反转整个逻辑false对于if ... else if语句,您必须单独编辑每个 if 子句。

只是一个哇 :) 这救了我的命
2021-04-22 07:42:32
很高兴至少帮助了一个人。:)
2021-04-30 07:42:32
投了票,应该被标记为答案。大多数程序员(或者可能只是我)使用服务器语言 exp。发现 JS 实现不直观。开始计算表达式并向后工作有点奇怪!
2021-05-03 07:42:32
这应该是正确的答案,因为它满足了 OP 以询问的风格提出的要求。然而,当我第一次看到 switch(true) 语句时,我感到很困难。
2021-05-04 07:42:32
只是一个旁注。这是一个明显的例子,不要假设拥有最多 SO 点的人有正确的答案。
2021-05-05 07:42:32

switch语句中,将switch表达式的评估值与案例的评估值进行比较。所以这里将raw_value(number) 的值与raw_value > 10.0(comparison expression) 和raw_value > 5.0(comparison expression) 进行比较。

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

只需使用简单的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,它就像原始一样干净。
2021-04-15 07:42:32

不,该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;
}

所以在你的情况下,最好使用第二个而不是第一个......

更少的代码行并不是客观地“更好”,因为“好的代码”是主观的。可读性和易于理解是另外两个因素。我可能会补充说这种方法更好,“如果目标是使用尽可能少的代码行”
2021-04-18 07:42:32
根据“开关”的工作方式,第一个示例将始终达到默认值
2021-05-09 07:42:32

不要在家里尝试这个,也不要太当真,这只是为了甜蜜的乐趣......

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

@sij_a 多年后,它就在那里:D
2021-04-15 07:42:32
嗯,这不应该是在 codepen 或其他什么地方,有趣的地方!不明白它在这里的意义......
2021-04-28 07:42:32