113

对不起这个愚蠢的问题。如何在 javascript switch-case 语言元素中为 case 使用条件?如下例所示,当变量liCount为 <=5 且 >0 时,大小写应该匹配;但是,我的代码不起作用:

switch (liCount) {
    case 0:
        setLayoutState('start');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case (liCount<=5 && liCount>0):
        setLayoutState('upload1Row');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case (liCount<=10 && liCount>5):
        setLayoutState('upload2Rows');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case (liCount>10):
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;                  
}

感谢您的任何建议!

4

13 回答 13

353

这有效:

switch (true) {
    case liCount == 0:
        setLayoutState('start');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case liCount<=5 && liCount>0:
        setLayoutState('upload1Row');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case liCount<=10 && liCount>5:
        setLayoutState('upload2Rows');
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;
    case liCount>10:
        var api = $('#UploadList').data('jsp');
        api.reinitialise();
        break;                  
}

唯一需要做的就是switch(true){...}让你的 case 表达式计算为布尔值。

它之所以有效,是因为我们赋予开关的值用作比较的基础。因此,case 表达式(也计算为布尔值)将确定运行哪个 case。也可以扭转这种局面,并通过switch(false){..}并将所需的表达式评估为 false 而不是 true.. 但个人更喜欢处理评估为真实性的条件。但是,它也确实有效,因此值得牢记以了解它在做什么。

例如:如果 liCount 为 3,则第一个比较是true === (liCount == 0),表示第一种情况为假。然后切换到下一个案例true === (liCount<=5 && liCount>0)。此表达式的计算结果为 true,这意味着此案例已运行,并在break. 我在此处添加了括号以使其更清晰,但它们是可选的,具体取决于表达式的复杂性。

它非常简单,并且是处理一系列条件的简洁方式(如果它适合您尝试做的事情),其中可能ìf() ... else if() ... else if () ...会引入大量视觉噪音或脆弱性。

谨慎使用,因为它是一种非标准模式,尽管它是有效代码。

于 2012-01-29T18:29:09.107 回答
29

复杂了。用 if 语句来编写它,而不是像这样:

if(liCount == 0)
    setLayoutState('start');
else if(liCount<=5)
    setLayoutState('upload1Row');
else if(liCount<=10)
    setLayoutState('upload2Rows');

$('#UploadList').data('jsp').reinitialise();

或者,如果ChaosPandion试图尽可能优化:

setLayoutState(liCount == 0 ? 'start' :
               liCount <= 5 ? 'upload1Row' :
               liCount <= 10 ? 'upload2Rows' :
               null);

$('#UploadList').data('jsp').reinitialise();
于 2011-03-28T20:05:20.670 回答
9

您想使用 if 语句:

if (liCount === 0) {
    setLayoutState('start');
} else if (liCount <= 5) {
    setLayoutState('upload1Row');
} else if (liCount <= 10) {
    setLayoutState('upload2Rows');
}
$('#UploadList').data('jsp').reinitialise();  
于 2011-03-28T20:01:28.633 回答
8

请参阅下面的 dmp 答案。如果可以的话,我会删除这个答案,但它被接受了,所以这是下一个最好的事情:)

你不能。JS 解释器要求您与 switch 语句进行比较(例如,没有“case when”语句)。如果你真的想这样做,你可以做if(){ .. } else if(){ .. }块。

于 2011-03-28T20:00:31.470 回答
6
switch (true) {
  case condition0:
    ...
    break;
  case condition1:
    ...
    break;
}

只要您的条件返回正确的值,它就可以在 JavaScript 中工作,但它与语句boolean相比没有太多优势。else if

于 2012-01-29T18:30:20.610 回答
5

您可以在 switch case 中使用 fall-through 方法。

const x = 'Welcome';

switch (x) {
  case 'Come':
    console.log(1)
    break;

  case 'Welcome':
  case 'Wel':
  case 'come':
    console.log(2)
    break;

  case 'Wel':
    console.log(3)
    break;

  default:
    break;
}

    
> Result => 2
于 2020-12-31T04:17:51.720 回答
4

在这种情况下,您应该使用if子句。

于 2011-03-28T20:00:07.260 回答
4

如果那是您想要做的,最好使用if语句。例如:

if(liCount == 0){
    setLayoutState('start');
}
if(liCount<=5 && liCount>0){
    setLayoutState('upload1Row');
}
if(liCount<=10 && liCount>5){
    setLayoutState('upload2Rows');
}             
var api = $('#UploadList').data('jsp');
    api.reinitialise();
于 2011-03-28T20:01:24.733 回答
3

如果可能的值是整数,则可以将案例捆绑在一起。否则,使用 ifs。

var api, tem;

switch(liCount){
    case 0:
    tem= 'start';
    break;
    case 1: case 2: case 3: case 4: case 5:
    tem= 'upload1Row';
    break;
    case 6: case 7: case 8: case 9: case 10:
    tem= 'upload2Rows';
    break;
    default:
    break;
}
if(tem) setLayoutState((tem);
api= $('#UploadList').data('jsp');
api.reinitialise();
于 2011-03-28T20:37:53.453 回答
2

您的代码不起作用,因为它没有按照您的期望执行。Switch 块接受一个值,并将每个 case 与给定值进行比较,寻找相等性。您的比较值是一个整数,但您的大多数 case 表达式都解析为一个布尔值。

所以,例如,说liCount = 2。您的第一个案例将不匹配,因为2 != 0. 你的第二种情况,(liCount<=5 && liCount>0)评估为true, 但是2 != true,所以这种情况也不匹配。

出于这个原因,正如许多其他人所说,您应该使用一系列if...then...else if块来执行此操作。

于 2011-03-28T20:09:15.090 回答
1

请注意,我们没有将 score 传递给 switch,而是 true。我们给开关的值用作比较的基础。

下面的例子展示了我们如何在 case: 中添加条件,而不需要任何 if 语句。

function getGrade(score) {
    let grade;
    // Write your code here
    switch(true) {
        case score >= 0 && score <= 5:
        grade = 'F';
        break;
        case score > 5 && score <= 10:
        grade = 'E';
        break;
        case score > 10 && score <= 15:
        grade = 'D';
        break;
        case score > 15 && score <= 20:
        grade = 'C';
        break;
        case score > 20 && score <= 25:
        grade = 'B';
        break;
        case score > 25 && score <= 30:
        grade = 'A';
        break;
    }

    return grade;
}
于 2019-11-11T03:32:58.583 回答
0

尽管在 OP 问题的特定示例中,switch不合适,但有一个示例 switch 仍然合适/有益,但还需要其他评估表达式。这可以通过使用表达式的默认子句来实现:

switch (foo) {
  case 'bar':
    // do something
    break;
  case 'foo':
    // do something
    break;
  ... // other plain comparison cases
  default:
    if (foo.length > 16) {
      // something specific
    } else if (foo.length < 2) {
      // maybe error
    } else {
      // default action for everything else
    }
}
于 2020-02-27T10:50:52.270 回答
0

如果您想在 switch 语句中传递任何值,然后在该传递值和评估语句上应用条件,那么您必须在函数下编写 switch 语句并在该函数中传递参数,然后在 switch 表达式中传递 true,如下例所示。

function numberChecker(num){
  let age;
  switch(true){  
      case num >= 0 && num <= 10:
          age = "Child";
      break;
      
      case num >= 10 && num <= 20:
          age = "Teenager";
      break;
      
      case num >= 20 && num <= 30:
          age = "Young";
      break;

      default:
          age = "Undefined!! Enter Age Between 0 - 30";
      break;
      
  }
  
  console.log("WOW You Are " + age);
}
numberChecker(15);

于 2021-03-09T20:54:43.950 回答