Question

在声明一组变量而不是分号时使用逗号有什么区别和/或优点（

）。

例如：

var foo = 'bar', bar = 'foo';

与

var foo = 'bar';
var bar = 'foo';

我知道如果你在第一个例子中的第一个变量上指定var关键字，它会在所有变量中保持不变，因此它们都会产生与范围相同的最终结果。这只是个人偏好，还是以这两种方式都有性能优势？

Answer 1

没有性能优势，只是个人选择和风格。

第一个版本更简洁。

更新

就通过网络传输的数据量而言，当然越少越好，但是为了看到真正的影响，您需要大量已删除的var声明。

Minification已被提及作为第一个例子有助于更好地缩小的东西，但是，正如Daniel Vassallo在评论中指出的那样，一个好的minifier会自动为你做这件事，所以在这方面没有任何影响。

Answer 2

在读完Crockford和其他人之后，我开始用逗号独占链接我的变量。然后，我真的被Chrome DevTools调试器烦恼了，它不会用逗号停在变量定义。对于调试器，使用逗号链接的变量定义是单个语句，而多个var语句是调试器可以停止的多个语句。因此，我改回了：

var a = doSomethingA,
    b = doSomethignB,
    c = doSomethingC;

要：

var a = doSomethingA;
var b = doSomethignB;
var c = doSomethingC;

到目前为止，我发现第二个变体更清晰，更不用说解决调试器问题的优势了。

通过电线＆＃34;更少的代码＆＃34;争论不具说服力，因为有缩小词。

Answer 3

我更喜欢var-per-variable符号：

var a = 2
var b = 3

因为其他comma-instead-of-another-var符号有以下三个缺点：

<强> 1。难以维持
请考虑以下代码：

var a = 1,
    b = mogrify(2),
    c = 3

但是，嘿，mogrify做了什么？让我们打印一下来找出：

var a = 1,
    b = mogrify(2),
    console.log(b)
    c = 3

打破了一些东西

<强> 2。难以阅读

线路乞讨中的变量清楚地表明将启动一个新变量。

var get_all_unicorn_promise = db.get_all_unicorns((unicorn) => {
        unicorn.legs.map((leg) => {
            leg.log('yes')
        })
    }).sort(),
    c = 3

c = 3在那里干嘛到底是什么意思？

第3。不一致

考虑一下：

var a = 1,
    b = 2,
    c = 3

使用var-per-variable每个声明都遵循相同的结构。使用comma-instead-of-another-var，第一个变量的声明方式与其他变量不同。如果您决定将第一个变量移动到for循环中，则必须将var添加到声明的中间

除了偏好之外，大多数着名项目似乎都使用var-per-variable符号

Answer 4

我同意其他的回答者，这主要是个人风格的问题。但是为了在讨论中引入“权威”意见，这是Douglas Crockford website of the popular JSLint tool所说的内容：

但是因为JavaScript没有块范围，所以在函数顶部声明所有函数的变量是明智的。建议每个函数使用一个var语句。这可以使用onevar选项强制执行。

Answer 5

正如其他人所说，这是一种风格偏好。 JSLint可能会告诉您每个功能只有一个var（如果您使用“好的部件”）。因此，如果使用JSLint检查您的代码（不是一个坏主意，恕我直言），您将最终使用第一种格式而不是后者。

另一方面，同一位作者Douglas Crockford表示将每个变量放在他自己coding conventions的行中。因此，如果您使用它，您可能需要取消选中JSLint中的“All one var per function”复选框。 ; - ）

Answer 6

由于我没有看到任何引用，here是ECMA-262规范的链接，这是JavaScript的基础规范。该页面的语法说：

12.2 Variable Statement

Syntax

  VariableStatement :
    var VariableDeclarationList ;

  VariableDeclarationList :
    VariableDeclaration
    VariableDeclarationList , VariableDeclaration

  VariableDeclarationListNoIn :
    VariableDeclarationNoIn
    VariableDeclarationListNoIn , VariableDeclarationNoIn

  VariableDeclaration :
    Identifier Initialiseropt

  VariableDeclarationNoIn :
    Identifier InitialiserNoInopt

  Initialiser :
    = AssignmentExpression
  InitialiserNoIn :
    = AssignmentExpressionNoIn

你能从中收集到的是使用逗号与否无关紧要。无论哪种方式，它最终被解析为VariableDeclaration并且被视为完全相同。脚本引擎如何处理这两个声明应该没有区别。唯一的区别是在其他答案中已经提到过的 - 节省了更多的空间，并且在编译脚本时应用语法来查找所有VariableDeclarations的时间差异实际上是无法估量的差异。

Answer 7

我认为没有任何明显的区别，只要我担心这只是个人偏好。

我讨厌有多个var声明，所以我通常会这样做：

var 
   one
  ,two
  ,three
  ,four
;

由于它更短且可读性更强，因此无需var噪音。

Answer 8

第一个保存了几个字符 - 因此在JS文件大小和带宽消耗方面节省很少。在极端情况下，唯一一次这种情况会变得明显。

Answer 9

我更喜欢第二个版本（每个版本都有自己的var）。我想那是因为我来自C ++背景。在C ++中，你可以像在第一个例子中那样声明变量，但它是不受欢迎的（当你试图以这种方式创建指针时很容易导致错误。）

Answer 10

如果你正在缩小你的javascript，那么有一个相当大的好处：

var one, two, three, four;

变为

var a, b, c, d;

在哪里

var one;
var two;
var three;
var four;

变为

var a;
var b;
var c;
var d;

这是var的另外三个实例，随着时间的推移会增加。

请参阅“A List Apart”系列文章“Better Javascript Minification”Part 1和Part 2

JavaScript变量定义：逗号与分号

10 个答案: