我是JavaScript中的乞丐,当我处理if/else条件时,发生了一些事情,但我仍然无法理解它.我的代码很简单:提示询问用户是否要进行加法或减法,然后以下2个提示询问一个值,并根据用户的答案,代码通过使用提供的值分别执行加法或减法.

当用户点击提示上的"取消"或"确定"按钮时,问题就会出现,如果点击这些按钮中的任何一个,我的代码会执行某些操作,它确实会执行,但它也会执行另一个我不希望它执行的操作.

如果用户单击"取消"或"确定",代码应提醒以下消息并完成执行:

(alert '未输入选项,中止操作!')

该代码成功提醒该消息,但也会提醒另一条消息,该消息仅在用户输入与SUMA或RESTA不同的值时才会显示.信息是这样的:

(alert '未输入有效选项,正在中止操作!');

然后我修改了代码,它按预期工作,但据我说,代码的第一个版本应该可以正常工作,没有任何问题.目标是在单击"取消"或"确定"按钮并完成执行时仅显示第一条消息,而不是同时显示两条消息并完成执行.

我希望足够清楚,如果我不清楚,请告诉我,如果有必要,我可以更详细地解释.有人能向我解释一下这里有什么问题吗?

以下是片段:

第一个版本(未按预期工作):

let opText = document.getElementById('opText');
let opOperation = prompt('Enter SUMA or RESTA');
let opSuma1; 
let opSuma2; 
let opStatus = true;
let opResult;

if(opOperation === null || opOperation === ""){
    (alert '未输入选项,中止操作!'); **//THE CODE DISPLAYS THIS MESSAGE IF EITHER 'CANCEL' OR 'OK' BUTTONS ARE CLICKED**
    opStatus = false;
}

else {
    opOperation = opOperation.trim().toLowerCase();
}

function addition(){
    opSuma1 = prompt('Enter first value:');;
    opSuma2 = prompt('Enter second value:');
    opSuma1 = Number(opSuma1);
    opSuma2 = Number(opSuma2);
    opResult = opSuma1 + opSuma2;
    opText.textContent = `Your result was a ADDITION and it is ${opResult}`;
}

function substraction(){
    opSuma1 = prompt('Enter first value:');;
    opSuma2 = prompt('Enter second value:');
    opSuma1 = Number(opSuma1);
    opSuma2 = Number(opSuma2);
    opResult = opSuma1 - opSuma2;
    opText.textContent = `Your result was a SUBSTRACTION and it is ${opResult}`;
}


if(opStatus && opOperation === 'suma'){
    addition();
}
else if(opStatus && opOperation === 'resta'){
    substraction();
}
**else {
    
    (alert '未输入有效选项,正在中止操作!'); **// BUT IT ALSO DISPLAYS THIS MESSAGE**
}**

第二版本(按预期工作)

let opText = document.getElementById('opText');
let opOperation = prompt('Enter SUMA or RESTA');
let opSuma1; 
let opSuma2; 
let opStatus = true;
let opResult;

if(opOperation === null || opOperation === ""){
    (alert '未输入选项,中止操作!');
    opStatus = false;
}

else {
    opOperation = opOperation.trim().toLowerCase();
}

function addition(){
    opSuma1 = prompt('Enter first value:');;
    opSuma2 = prompt('Enter second value:');
    opSuma1 = Number(opSuma1);
    opSuma2 = Number(opSuma2);
    opResult = opSuma1 + opSuma2;
    opText.textContent = `Your result was a ADDITION and it is ${opResult}`;
}

function substraction(){
    opSuma1 = prompt('Enter first value:');;
    opSuma2 = prompt('Enter second value:');
    opSuma1 = Number(opSuma1);
    opSuma2 = Number(opSuma2);
    opResult = opSuma1 - opSuma2;
    opText.textContent = `Your result was a SUBSTRACTION and it is ${opResult}`;
}

 if (opStatus) {
     if (opOperation === 'suma') {
         addition();
     } else if (opOperation === 'resta') {
         substraction();
     } else {
         (alert '未输入有效选项,正在中止操作!');
     }
 }

推荐答案

您将条件分解为两个不相关的分支.

第一个:

    if(opOperation === null || opOperation === ""){
        alert('No option entered, aborting operation!'); **//THE CODE DISPLAYS THIS MESSAGE IF EITHER 'CANCEL' OR 'OK' BUTTONS ARE CLICKED**
        opStatus = false;
    }

    else {
        opOperation = opOperation.trim().toLowerCase();
    }

当第一个结束时,它不会停止程序,因此在其他结束后,它会继续到下一个.

秒一:

    if(opStatus && opOperation === 'suma'){
        addition();
    }
    else if(opStatus && opOperation === 'resta'){
        substraction();
    }
    **else {
    
        alert('No valid option entered, aborting operation!'); **// BUT IT ALSO DISPLAYS THIS MESSAGE**
    }**

如果第一个if为真,那么剩下的两个肯定为假,因为opStatus已经被确定为空.因此,它会转到else声明(如果if-branch中的其他内容都不为真,则会判断该声明)并执行它.

如果您通过将第二个放入第一个的其他部分中来将它们嵌入,那么问题就会得到解决.

    if(opOperation === null || opOperation === ""){
        alert('No option entered, aborting operation!'); **//THE CODE DISPLAYS THIS MESSAGE IF EITHER 'CANCEL' OR 'OK' BUTTONS ARE CLICKED**
        opStatus = false;
    }

    else {
        opOperation = opOperation.trim().toLowerCase();

        if(opStatus && opOperation === 'suma'){
            addition();
        }
        else if(opStatus && opOperation === 'resta'){
            substraction();
        }
        **else {
            alert('No valid option entered, aborting operation!'); **// BUT IT ALSO DISPLAYS THIS MESSAGE**
        }**
    }

您在第二个解决方案中使用相同的原则:

    if (opStatus) {
        if (opOperation === 'suma') {
            addition();
        } else if (opOperation === 'resta') {
            substraction();
        } else {
            alert('No valid option entered, aborting operation!');
        }
    }

在该示例中,您判断opStatus是否是任何内容.我建议将该示例中的第一个和第二个if分支结合起来,并删除opStatus,因为它不做任何事情.相反,使用if (opOperation).这是有效的,因为实际上不存在truefalse这样的东西.任何粗略等于零的东西都将被视为假,而false则为零.""是零,null除了null之外什么都不等于,但在比较中它被视为假,尽管无法转换.

    if (opOperation) {
        opOperation = opOperation.trim().toLowerCase();
        if (opOperation === 'suma') {
            addition();
        } else if (opOperation === 'resta') {
            substraction();
        } else {
            alert('No valid option entered, aborting operation!');
        }
    }
    else {
        alert('No option entered, aborting operation!');
    }

let opText = document.getElementById('opText');
let opOperation = prompt('Enter SUMA or RESTA');
let opSuma1; 
let opSuma2; 
let opResult;

function addition(){
    opSuma1 = prompt('Enter first value:');;
    opSuma2 = prompt('Enter second value:');
    opSuma1 = Number(opSuma1);
    opSuma2 = Number(opSuma2);
    opResult = opSuma1 + opSuma2;
    opText.textContent = `Your result was a ADDITION and it is ${opResult}`;
}

function substraction(){
    opSuma1 = prompt('Enter first value:');;
    opSuma2 = prompt('Enter second value:');
    opSuma1 = Number(opSuma1);
    opSuma2 = Number(opSuma2);
    opResult = opSuma1 - opSuma2;
    opText.textContent = `Your result was a SUBSTRACTION and it is ${opResult}`;
}

if (opOperation) {
    opOperation = opOperation.trim().toLowerCase();
    if (opOperation === 'suma') {
        addition();
    } else if (opOperation === 'resta') {
        substraction();
    } else {
        alert('No valid option entered, aborting operation!');
    }
}
else {
    alert('No option entered, aborting operation!');
}

如果我在某个地方犯了错误,请告诉我(我知道我的代码有效).

Javascript相关问答推荐

为什么使用MAX_SAFE_INTEGER生成随机整数时数字分布不准确?

如何将拖放功能添加到我已自定义为图像的文件输入HTML标签中?

ReactJS中的material UI自动完成类别

如何在angular中从JSON值添加动态路由保护?

jQuery s data()[storage object]在vanilla JavaScript中?'

当试图显示小部件时,使用者会出现JavaScript错误.

如何通过使用vanilla JS限制字体大小增加或减少两次来改变字体大小

如何将Cookie从服务器发送到用户浏览器

并不是所有的iframe都被更换

是什么导致了这种奇怪的水平间距错误(?)当通过JavaScript将列表项元素追加到无序列表时,是否在按钮之间?

当输入字段无效时,我的应用程序不会返回错误

如何在.NET Core中将chtml文件链接到Java脚本文件?

获取';无法解决导入和导入";slick-carousel/slick/slick-theme.css";';错误

在不扭曲纹理的情况下在顶点着色器中旋转UV

通过跳过某些元素的对象进行映射

如何让SVG图标在被点击和访问后改变 colored颜色 ,并在被访问后取消点击时恢复到原来的 colored颜色 ?

如何在移动设备中使用JAVASSCRIPT移除点击时的焦点/悬停状态

我如何才能让p5.js在不使用实例模式的情况下工作?

如何为两条动态路由创建一个页面?

MUI-TABLE:MUI表组件中交替行的不同 colored颜色 不起作用