Question

为什么下面的代码片段取自this article，由于花括号的位置只发生了一次变化，会产生不同的结果？

当开头大括号{在新行上时，test()会返回undefined，并且警报中会显示“不 - 它已经破坏：未定义”。

function test()
{
  return
  { /* <--- curly brace on new line */
    javascript: "fantastic"
  };
}

var r = test();
try {
  alert(r.javascript); // does this work...?
} catch (e) {
  alert('no - it broke: ' + typeof r);
}

当大括号与return在同一行时，test()会返回一个对象，并且会提醒“神奇”。

function test()
{
  return { /* <---- curly brace on same line */
    javascript: "fantastic"
  };
}

var r = test();
try {
  alert(r.javascript); // does this work...?
} catch (e) {
  alert('no - it broke: ' + typeof r);
}

Answer 1

这是JavaScript的一个陷阱：自动分号插入。不以分号结尾但可能是语句结尾的行会自动终止，因此您的第一个示例看起来像这样：

function test()
{
  return; // <- notice the inserted semicolon
  { 
    javascript: "fantastic"
  };
}

另请参阅Douglas Crockford's JS style guide，其中提到了分号插入。

在第二个示例中，您返回一个对象（由花括号构建），其属性为javascript，其值为"fantastic"，实际上与此相同：

function test() {
    var myObject = new Object();
    myObject.javascript = "fantastic";
    return myObject;
}

Answer 2

Javascript在语句结束时不需要分号，但缺点是它必须猜测分号的位置。大多数情况下这不是问题，但有时它会发明一个你不打算使用分号的分号。

我博客文章中有关此问题的示例（Javascript – almost not line based）：

如果您格式化代码如下：

function getAnswer() {
   var answer = 42;
   return
      answer;
}

然后它被解释为：

function getAnswer() {
  var answer = 42;
  return;
  answer;
}

return语句采用无参数形式，参数成为它自己的声明。

您的代码也是如此。该函数被解释为：

function test()
{
  return;
  {
    javascript : "fantastic"
  };
}

Answer 3

这是因为javascript最常放“;”在每一行的末尾，所以基本上当你返回{在同一行，javascript引擎看到会有更多的东西，当它在新行中它认为你忘了放“;”，并把它给你。

Answer 4

这里的花括号表示新对象的构造。因此，您的代码等同于：

function test() {
  var a = { javascript : "fantastic" };
  return a;
}

有效，如果你写：

function test() {
  var a = { javascript : "fantastic" };
  return; // ; is automatically inserted 
      a;
}

它不再有效。

Answer 5

我个人更喜欢Allman Style的可读性（vs K＆amp; R风格）。

而不是......

function test() {
  return {
    javascript : "fantastic"
  };
}

我喜欢......

function test() 
{
  var obj =
  {
    javascript : "fantastic"
  };

  return obj;
}

但这是一种解决方法。我可以忍受它。

Answer 6

问题实际上是如上所述的分号注射。我刚读了一篇关于这个主题的好文章。它解释了这个问题以及关于javascript的更多内容。它还包含一些很好的参考。你可以阅读它here

为什么结果因大括号放置而异？

6 个答案: