Question

下面是一些行为不符合预期的代码。传递给保存此代码的函数的middleLayerChoice为'2MM'。现在看一下，错误是显而易见的，但是它被嵌套到一个更长的条件分支中（我将重构为Switch语句）所以我花了一些试错法运行插入一些console.log('line x')声明。破碎的代码如下：

if (middleLayerChoice === '1MM') 
     if (buttonID === 'xmm2mm') {
          console.log('MID = 1mm, TOP = 2mm');
          return ('resources/OptionalTopCovers/M_2_1.js');
     }                
     else if (buttonID === 'xmm3mm') {
          console.log('MID = 1mm, TOP = 3mm');
          return ('resources/OptionalTopCovers/M_3_1.js');
     }
else if(middleLayerChoice === '2MM') {
     if (buttonID === 'xmm2mm') {
          console.log('MID = 2mm, TOP = 2mm');
          return ('resources/OptionalTopCovers/M_2_2.js');
     }
     else if (buttonID === 'xmm3mm') {
          console.log('MID = 2mm, TOP = 3mm');
          return ('resources/OptionalTopCovers/M_3_2.js'); 
     }
}
...
...
else {
     console.log('getNewObject case 3 failed');
}

我缺少的是一整套大括号：

if (middleLayerChoice === '1MM') **{**
     if (buttonID === 'xmm2mm') {
          console.log('MID = 1mm, TOP = 2mm');
          return ('resources/OptionalTopCovers/M_2_1.js');
     }
**}**

一旦我们完成了对我的业余错误的傻笑，有人能告诉我为什么JavaScript控制台或WebStorm没有警告我这个错误吗？我的代码没有崩溃，我的else语句没有记录我想要的错误，并且代码保持运行状态正常（返回的是undefined值）。

我觉得来自其他语言的编译器会因为这个错误而尖叫我;那么JavaScript 和 WebStorm忽略了这一点背后的原因是什么？

Answer 1

因为它在技术上是合法的。您可以拥有一行语句块。所以，这就是为什么代码没有抱怨，虽然这绝对不是你想要的，因为这个：

if (middleLayerChoice === '1MM') 
     if (buttonID === 'xmm2mm') {
          console.log('MID = 1mm, TOP = 2mm');
          return ('resources/OptionalTopCovers/M_2_1.js');
     }                
     else if (buttonID === 'xmm3mm') {
          console.log('MID = 1mm, TOP = 3mm');
          return ('resources/OptionalTopCovers/M_3_1.js');
     }
else if(middleLayerChoice === '2MM') {
     if (buttonID === 'xmm2mm') {
          console.log('MID = 2mm, TOP = 2mm');
          return ('resources/OptionalTopCovers/M_2_2.js');
     }
     else if (buttonID === 'xmm3mm') {
          console.log('MID = 2mm, TOP = 3mm');
          return ('resources/OptionalTopCovers/M_3_2.js'); 
     }
}
...
...
else {
     console.log('getNewObject case 3 failed');
}

被解释为（注意缩进，为了清晰起见添加了大括号）：

if (middleLayerChoice === '1MM') {
     if (buttonID === 'xmm2mm') {
          console.log('MID = 1mm, TOP = 2mm');
          return ('resources/OptionalTopCovers/M_2_1.js');
     }                
     else if (buttonID === 'xmm3mm') {
          console.log('MID = 1mm, TOP = 3mm');
          return ('resources/OptionalTopCovers/M_3_1.js');
     }
     else if(middleLayerChoice === '2MM') {
        if (buttonID === 'xmm2mm') {
          console.log('MID = 2mm, TOP = 2mm');
          return ('resources/OptionalTopCovers/M_2_2.js');
        }
        else if (buttonID === 'xmm3mm') {
          console.log('MID = 2mm, TOP = 3mm');
          return ('resources/OptionalTopCovers/M_3_2.js'); 
        }
     }
     ...
     ...
     else {
         console.log('getNewObject case 3 failed');
     }
}

仅middleLayerChoice === '1MM'实际上可以“进入”，以检查buttonID。

非常感谢@apsillers帮助我纠正这个问题。

Answer 2

JavaScript if后面可以跟一个块或一个语句。

if (1)
    doSomething();
else
    doSomethingElse();
doSomethingInEitherCase();

......是有效的，虽然不高兴，JS。

JS Hint之类的工具可以提醒您注意有效但受此类问题困扰的语法。

Answer 3

正如其他人所说;没有错误，如果没有大括号，if适用于语句，它们适用于块。

为避免将来出现此问题，您可以重新格式化代码（Ctrl-Alt-L或使用Ctrl-Shift-A搜索它）Webstorm将自动更改缩进并明确哪些行属于哪个if-block

为了使问题在未来更加明显，您可以进入设置＆gt;编辑器＆gt;代码风格＆gt; JavaScript，选项卡环绕和大括号，并更改＆＃34;强制括号＆＃34;总是＆＃34;总是＆＃34; for if，while，for和do。

与其他语言相比，Webstorm中的JavaScript支持更糟糕; 好，但不是Java级别甚至PHP级别。可能是因为JavaScript非常灵活，不是以静态类型的任何方式，并且在其大部分时间内都缺乏监督。添加docblock有很多帮助。

还有很多其他工具也可以提供帮助，例如ESLint和TypeScript;，但是当你是初学者时，设置它们可能比它的价值更大。

有没有理由说JavaScript控制台或WebStorm IDE没有警告我这个错误？

3 个答案: