JavaScript：在 switch case 中使用条件

javascript conditional-statements select-case

2022-08-30 05:03:51

如何在 JavaScript 的 switch 语句中使用条件？在下面的示例中，当变量为和时，事例应匹配;但是，我的代码不起作用：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;
  default:
    break;
}

感谢您的任何建议！

答案 1

这有效：

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;                  
}

唯一需要的是，对于您的 case 表达式，求值为布尔值。switch(true){...}

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

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

这很简单，并且是处理一长串条件的简洁方法（如果它符合您要做的事情），其中可能一长串条件可能会引入很多视觉噪音或脆弱性。ìf() ... else if() ... else if () ...

请谨慎使用，因为它是非标准模式，尽管它是有效的代码。

答案 2

你把这一点搞得太复杂了。用 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();