Javascript 为什么结果会因花括号的位置而异?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3641519/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why do results vary based on curly brace placement?
提问by JustLearn
Why do the code snippets below, taken from this article, produce different results due to only a single change in the placement of curly braces?
为什么下面的代码片段(摘自本文)会因为花括号的位置发生单一变化而产生不同的结果?
When the opening curly brace {is on a new line, test()returns undefined, and "no - it broke: undefined" is displayed in the alert.
当左花括号{在新行上时,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);
}
When the brace is on the same line as return, test()returns an object, and "fantastic" is alerted.
当大括号与 位于同一行时return,test()返回一个对象,并警告“fantastic”。
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);
}
回答by Residuum
That's one of the pitfalls of JavaScript: automatic semicolon insertion. Lines that do not end with a semicolon, but could be the end of a statement, are automatically terminated, so your first example looks effectively like this:
这是 JavaScript 的陷阱之一:自动分号插入。不以分号结尾但可能是语句结尾的行会自动终止,因此您的第一个示例实际上如下所示:
function test()
{
return; // <- notice the inserted semicolon
{
javascript: "fantastic"
};
}
See also Douglas Crockford's JS style guide, which mentions semicolon insertion.
另请参阅Douglas Crockford 的 JS 样式指南,其中提到了分号插入。
In your second example you return an object (built by the curly braces) with the property javascriptand its value of "fantastic", effectively the same as this:
在您的第二个示例中,您返回一个对象(由花括号构建),其属性javascript及其值为"fantastic",实际上与此相同:
function test() {
var myObject = new Object();
myObject.javascript = "fantastic";
return myObject;
}
回答by Guffa
Javascript doesn't require semicolons at the end of statements, but the drawback is that it has to guess where the semicolons are. Most of the time this is not a problem, but sometimes it invents a semicolon where you didn't intend one.
Javascript 不需要在语句末尾使用分号,但缺点是它必须猜测分号的位置。大多数时候这不是问题,但有时它会在你不想要的地方发明一个分号。
An example from my blog post about this (Javascript – almost not line based):
我的博客文章中的一个示例(Javascript – 几乎不是基于行的):
If you format the code like this:
如果您像这样格式化代码:
function getAnswer() {
var answer = 42;
return
answer;
}
Then it is interpreted like this:
然后解释如下:
function getAnswer() {
var answer = 42;
return;
answer;
}
The return statement takes its parameterless form, and the argument becomes a statement of its own.
return 语句采用它的无参数形式,参数变成了它自己的语句。
The same happens to your code. The function is interpreted as:
您的代码也会发生同样的情况。该函数被解释为:
function test()
{
return;
{
javascript : "fantastic"
};
}
回答by Michael R
I personally prefer the Allman Style for readability (vs K&R style).
我个人更喜欢 Allman 风格的可读性(与 K&R 风格相比)。
Instead of…
代替…
function test() {
return {
javascript : "fantastic"
};
}
I like…
我喜欢…
function test()
{
var obj =
{
javascript : "fantastic"
};
return obj;
}
But this is a work-around. I can live with it though.
但这是一种变通方法。不过我可以忍受。
回答by Darin Dimitrov
The curly braces here indicate the construction of a new object. Thus your code is equivalent to:
这里的花括号表示新对象的构造。因此,您的代码等效于:
function test() {
var a = { javascript : "fantastic" };
return a;
}
which works whereas if you write:
哪个有效,而如果你写:
function test() {
var a = { javascript : "fantastic" };
return; // ; is automatically inserted
a;
}
it no longer works.
它不再起作用。
回答by cichy
It's because javascript most often puts ";" at the end of each line, so basicly when you have return { in same line, javascript engine see that there will be something more, and when its in new line it thinks you forgot to put ";", and puts it for you.
这是因为 javascript 最常放置“;” 在每一行的末尾,所以基本上当你在同一行中返回 { 时,javascript 引擎会看到会有更多的东西,当它在新行中时,它认为你忘记放置“;”,并为你放置它。
回答by Ivo van der Wijk
The problem is indeed semicolon injection as described above. I just read a good blog posting on this subject. It explains this issue and a whole lot more about javascript. It also contains some good references. You can read it here
问题确实是如上所述的分号注入。我刚刚读了一篇关于这个主题的好博客。它解释了这个问题以及更多关于 javascript 的内容。它还包含一些很好的参考。你可以在这里阅读

