Определение переменной JavaScript: запятая или точка с запятой

Каковы различия и/или преимущества, если таковые имеются, использования запятых при объявлении группы переменных, а не точек с запятой.

Например:

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

против

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

Я знаю, что если вы укажете ключевое слово var для первой переменной в первом примере, оно будет сохраняться во всех переменных, поэтому они оба будут давать одинаковый конечный результат в отношении области видимости. Является ли это личным предпочтением, или есть ли преимущество в производительности для этого в любом случае?

Ответ 1

Отсутствие выгоды от производительности, просто вопрос личного выбора и стиля.

Первая версия просто более кратка.


Обновить:

Что касается количества данных, проходящих по проводу, то, конечно, меньше, тем не менее, вам понадобится чертовски много удаленных объявлений var, чтобы увидеть реальное влияние.

Минификация была упомянута как нечто, что первый пример поможет с для лучшего минификация, однако, как Даниэль Vassallo указует в комментариях, хороший Minifier автоматически сделает это за вас в любом случае, так что в этом отношении никакого воздействия.

Ответ 2

Интересный факт дня: В JavaScript вы можете использовать запятые для группировки любого числа выражений в один оператор. Это в основном артефакт оператора for, где несколько выражений присваивания часто группируются вместе в заголовке. Большинство людей не знают, что такой синтаксис по-прежнему действителен вне цикла for. Таким образом, вы можете сделать это

var i = 0;
while (i < 10)
    alert(i + ' * ' + i + ' = '),
    alert(i * i + '!!'),
    i++;

alert("Wasn't that fun??");

Вместо

var i = 0;
while (i < 10) {
    alert(i + ' * ' + i + ' = ');
    alert(i * i + '!!');
    i++;
}

alert("Wasn't that fun??");

Хотя большинство людей советовали бы вам не делать этого.

Заявления, такие как var, не могут использоваться таким образом. То есть вы не можете иметь var в середине кучи других разделенных запятыми выражений.

В любом случае... чем больше вы знаете...

Ответ 3

Прочитав Крокфорда и других, я начал целенаправленно связывать свои переменные с запятой. Позднее меня действительно раздражало отладчик Chrome DevTools, который не останавливался на определения переменных с запятой. Для отладчика определения переменных, закодированные запятыми, представляют собой единый оператор, в то время как несколько операторов var - это несколько операторов, от которых может останавливаться отладчик. Поэтому я переключился с:

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

To:

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

В настоящее время я считаю второй вариант более чистым, не говоря уже о его преимуществе решения проблемы отладчика.

Аргумент "меньше кода через провод" не является убедительным, так как есть minifiers.

Ответ 4

Я предпочитаю обозначение var-per-variable:

var a = 2
var b = 3

потому что другая нотация comma-instead-of-another-var имеет эти три недостатка:

1. Трудно поддерживать
Рассмотрим этот код:

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

Но эй, что делает mogrify? Пусть напечатайте b, чтобы узнать:

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

ломает материал

2. Трудно читать

var в попрошайничестве строки ясно сообщает, что будет инициирована новая переменная.

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

Ответ 5

Я согласен с другими респондентами в том, что это в основном вопрос личного стиля. Но чтобы привести "авторитетное" мнение в дискуссию, это то, что Дуглас Крокфорд говорит о веб-сайт популярного инструмента JSLint:

Но поскольку JavaScript не имеет области блока, разумнее объявить все функциональные переменные в верхней части функции. Для каждой функции рекомендуется использовать один оператор var. Это можно выполнить с помощью опции onevar.

Ответ 6

Как отмечали другие, это предпочтение стиля. JSLint может сказать вам, что у вас есть только одна var за функцию (если вы используете "Хорошие детали" ). Таким образом, если вы используете JSLint для проверки кода (не плохой идеи, IMHO), вы в конечном итоге используете первый формат больше, чем последний.

С другой стороны, тот же автор, Дуглас Крокфорд, говорит, чтобы поместить каждую переменную в свою строку в свой соглашения о кодировании. Поэтому вы можете снять флажок "Все один var за функцию" в JSLint, если вы его используете.; -)

Ответ 7

Первый сохраняет несколько символов - таким образом, существует очень небольшая экономия с точки зрения размера JS и, следовательно, потребления полосы пропускания. Единственный момент, когда это станет заметным, будет в крайних случаях.

Ответ 8

Если вы уменьшаете свой 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" "Лучшая Javascript Minification" Часть 1 и Часть 2

Ответ 9

Поскольку я не вижу никаких ссылок на него, здесь является ссылкой на спецификацию 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 и обрабатывается точно так же. Не должно быть никакой разницы в том, как движок script обрабатывает два объявления. Единственные различия были бы уже упомянуты в других ответах - сэкономить больше места и практически неизмеримые различия в количестве времени, которое требуется для применения грамматики, чтобы найти все VariableDeclarations при компиляции script.

Ответ 10

Я предпочитаю вторую версию (у каждого есть свой var). Я думаю, это потому, что я исхожу из фона С++. В С++ вы можете объявлять переменные, как в первом примере, но на него нахмурились (это легко приводит к ошибкам, когда вы пытаетесь создать указатели таким образом).

Ответ 11

Я не думаю, что есть какая-то заметная разница, насколько я понимаю, это просто личные предпочтения.

Мне очень жаль, что у меня есть несколько объявлений var, поэтому я обычно делаю:

var 
   one
  ,two
  ,three
  ,four
;

Чем короче и, возможно, более читабельным, тем меньше шума var.