Question

很抱歉，如果我在写这篇文章时犯了错误。我是新来的，我不知道这是如何运作的，希望我能快速学习。我也是JavaScript的新手。

所以问题是：我在 code.elements.js 文件中有这个，我无法使其正常工作。

这样做有用吗？

if (codePrompt == (codeSwitch || codeSwitchBG || codeBlur || codeShowInfo)){};

或者我必须按正常方式制作吗？比如

if (codePrompt == codeSwitch || codePrompt == codeSwitchBG || codePrompt == codeBlur || codePrompt == codeShowInfo){};


var codeSwitch = 'switch()';
var codeSwitchBG = 'switch(background)';
var codeBlur = 'blur()';
var codeShowInfo = 'showInfo()';

$(".code").on("click", function () {
var codePrompt = prompt("Set the code in the command line.");
if (codePrompt == (codeSwitch || codeSwitchBG || codeBlur || codeShowInfo)) {
    if (codePrompt == codeSwitch) {
        alert("Switching background...");
        console.log("Used '" + codeSwitch + "' command.");
    } else if(codePrompt == codeBlur) {
        alert("Blurring elements...");
        console.log("Used '" + codeBlur + "' command.");
    } else if(codePrompt == codeSwitchBG) {
        alert("Switching background...");
        console.log("Used '"+ codeSwitchBG + "' command.");
    }else if(codePrompt == codeShowInfo) {
        alert("Showing info...");
        console.log("Used '"+ codeShowInfo + "' command.");
    }
} else {
    alert("Wrong command, try again.");
    console.log("Wrong command, try again.");
};
});

Answer 1

您必须按照提及的第二种方式执行此操作：

if (codePrompt == codeSwitch ||
codePrompt == codeSwitchBG || codePrompt == codeBlur || codePrompt == codeShowInfo){};

Answer 2

＆＃34;正常＆＃34;方式以您可能期望的方式运作。

然而，无论如何，if语句是多余的。你可以跳过它：

if (codePrompt === codeSwitch) {
    alert("Switching background...");
    console.log("Used '" + codeSwitch + "' command.");
} else if (codePrompt === codeBlur) {
    alert("Blurring elements...");
    console.log("Used '" + codeBlur + "' command.");
} else if (codePrompt === codeSwitchBG) {
    alert("Switching background...");
    console.log("Used '" + codeSwitchBG + "' command.");
} else if (codePrompt === codeShowInfo) {
    alert("Showing info...");
    console.log("Used '" + codeShowInfo + "' command.");
} else {
    alert("Wrong command, try again.");
    console.log("Wrong command, try again.");
}

这是switch的一个很好的用例，我会这样重构：

var alertMessage = "",
    consoleMessage = "Used '" + codePrompt + "' command.";
switch (codePrompt) {
    case codeSwitch:
        alertMessage = "Switching background...";
        break;
    case codeBlur:
        alertMessage = "Blurring elements...";
        break;
    case codeSwitchBG:
        alertMessage = "Switching background...";
        break;
    case codeShowInfo:
        alertMessage = "Showing info...";
        break;
    default:
        alertMessage = consoleMessage = "Wrong command, try again.";
        break;
}
alert(alertMessage);
console.log(consoleMessage);

Answer 3

是的，你必须让它成为'正常'的方式。

什么

if (codePrompt == (codeSwitch || codeSwitchBG || codeBlur || codeShowInfo)){};

确实是

1）测试所有开关 - 如果任何为TRUE则返回TRUE

2）测试codePrompt == TRUE或FALSE。

根据您的代码，您可以完全删除该测试，然后直接进入最终的ELSE。

另一种选择是使用SWITCH语句，最后一个ELSE成为DEFAULT子句。

Answer 4

您实现此逻辑的方式我建议使用switch语句以实现可读性：

switch (codePrompt){
case "switch()": 
{
    //Handle case
    break;
}
case "switch(background)": 
{  
   //Handle Case
   break;
}
case "blur()":
{
    //Handle Case
    break;
}
default :
{
  alert("Wrong command, try again.");
  console.log("Wrong command, try again.");
}

Answer 5

因为JavaScript有short circuit evaluation而你的字符串是truthy，所以你需要使用第二种方法或你所说的＆＃34;正常方式＆＃34;。

第一种方法不起作用，因为你最终评估错误的东西。评估的工作方式如下：

var result = 0 || "zero" ;

0被评估并确定为假的。
"zero"被评估为真实并成为结果。

var result = "zero" || 0 ;

"zero"被评估并确定为真实并作为结果返回。
0未被评估。

在原始代码中：

if (codePrompt == (codeSwitch || codeSwitchBG || codeBlur || codeShowInfo)){};

||的运算符关联性是从左到右。括号从内到外进行评估。

首先评估

(codeSwitch || codeSwitchBG || codeBlur || codeShowInfo)。由于我们已经讨论过的规则，结果变为codeSwitch：

codeSwitch || codeSwitchBG成为codeSwitch
codeSwitch || codeBlur成为codeSwitch
codeSwitch || codeShowInfo成为codeSwitch

所以你最终评估：

if(codePrompt == codeSwitch)

当然这是错误的。

Answer 6

您还可以按照以下方式重构if / switch：

var commands = {
    'switch()': 'Switching background',
    'switch(background)': 'Switching background',
    'blur()': 'Blurring elements',
    'showInfo()': 'Showing info'
};

$(".code").on("click", function () {
    var codePrompt = prompt("Set the code in the command line.");
    if (commands.hasOwnProperty(codePrompt)) {
        alert(commands[codePrompt] + '...');
        console.log("Used '" + codePrompt + "' command.");
    } else {
        alert("Wrong command, try again.");
        console.log("Wrong command, try again.");
    }
});

Javascript：如何简化具有多个OR条件的if语句？

6 个答案: