Javascript Var заявление и производительность - PullRequest
6 голосов
/ 12 марта 2012

Опция 1: множественная переменная без присваивания

function MyFunction() {

  var a = null;
  var b = null;
  ....
  var z = null;

  a = SomeValue;
  b = SomeValue2;
  ....
}

Опция 2: одна выписка без присваивания

function MyFunction() {

  var a, b ..., z;

  a = SomeValue;
  b = SomeValue2;
  ....
}

Вариант 3: несколько операторов var с присваиванием

function MyFunction() {

  var a = SomeValue;
  var b = SomeValue2;
  ....
  var z = SomeValue26;
}

Есть ли какой-либо выигрыш в производительности при использовании определенного параметра?Верно ли это для обоих примитивных присвоений типов AND присвоений ссылок на объекты?

Спасибо за ваш вклад.

Ответы [ 7 ]

17 голосов
/ 12 марта 2012

"преждевременная оптимизация - корень все зло "

Я не думаю, что будет какое-либо значительное изменение производительности с любой из этих опций.
(IMO) Третий вариант - самый читаемый и наиболее близкий к динамическому распределению памяти, например C# и т. Д. Но это мое скромное мнение, Выберите то, что вам нравится больше всего.

Если это действительно беспокоит вас, и вы не можете спать без ответа, протестируйте его с помощью jsPerf .


@ Чад сделал jsPerf , чтобы вы могли хорошо спать сегодня вечером ...

6 голосов
/ 12 марта 2012

Чтобы понять производительность, вы должны сначала понять подъем . Давайте возьмем следующий код:

var x = 1;

function bar(val) {
    var returnVal = val * 2;

    return returnVal;
}

function foo(val) {
    var returnVal = 10;

    returnVal *= bar(val);

    return returnVal;
}

var y = foo(x);

console.log(y); // 20

Подъем в основном означает, что интерпретатор JavaScript «поднимет» объявление переменной до вершины ее области видимости. Чтобы этот пример выглядел больше так:

var x, y;

x = 1;

function bar(val) {
    var returnVal;

    returnVal = val * 2;

    return returnVal;
}

function foo(val) {
    var returnVal;

    returnVal = 10;
    returnVal *= bar(val);

    return returnVal;
}

y = foo(x);

console.log(y); // 20

Итак, в приведенных вами примерах, Варианты 2 и 3 в основном будут делать то же самое. Поскольку переводчик переместит эти объявления наверх. На этом этапе это решение предпочтения. Многие люди избегают делать что-то вроде var x, y, z;, говоря, что это опасно. Я лично это делаю. В какой бы области я ни находился, я объявлю все переменные вверху, а затем использую их ниже. Но в любом случае работает.

Теперь ваш первый пример наименее эффективен. После подъема это будет выглядеть так:

function MyFunction() {
    var a, b, ... z;

    a = null;
    b = null;
    ...
    z = null;

    a = someValue;
    b = someValue2;
    ...
    z = someValueN;
}

В основном это приводит к установке переменных дважды.

1 голос
/ 12 марта 2012

В Chrome время выполнения идентично .

Единственное реальное соображение здесь - это оптимизация сетевой передачи .

Рассмотрим var a=1;var b=2;...;var z=9; против var a=1,b=2,...,z=9;

Если вы поставите ;var перед каждым идентификатором, это будет 5 байтов (при условии однобайтовой кодировки символов), в отличие от 1 байта для ,. Таким образом, объявив 26 переменных, вы можете сохранить 100 байтов, написав один раз var и перечислив идентификаторы с запятыми.

Конечно, это не огромная экономия, но каждый байт помогает, когда дело доходит до передачи битов по сети. Не о чем беспокоиться, но если вы обнаружите, что объявляете несколько переменных в одной и той же области, использование списка объявлений переменных - это простой способ сократить количество байтов в вашем файле JS.

0 голосов
/ 12 марта 2012

Просто держитесь подальше от варианта 1, если это возможно, нет необходимости выполнять два задания.

Даже переменные, объявленные внутри цикла for или другого составного оператора / блока, будут доступны за пределами содержащего его блока.

Вы также можете сделать:

function MyFunction() {

  var a = SomeValue, b = SomeVavlue2;

}
0 голосов
/ 12 марта 2012

Все они в основном делают одно и то же: объявляют переменную и, в конце концов, определяют ее (присваивают ей что-то).Единственное, что вы меняете в своих примерах, - это порядок, в котором это происходит, и даже это зависит от браузера, который компилирует ваш JavaScript - некоторые могут выполнять оптимизацию, а другие нет.

Есть некоторыеВы должны следовать стилистическим указаниям, и этот ответ хорошо их объясняет.Помните, что этот ответ не зависит от технологии и может вообще не относиться к JavaScript.

0 голосов
/ 12 марта 2012

Я отвечу на ваш вопрос о производительности несколькими вопросами:

  1. Вы заметили проблему с производительностью?
  2. Вы определили, что ваше утверждение о вар был узким местом?
  3. Вы тестировали каждую версию?

Я предполагаю, что ответ на все эти вопросы был нет .

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


В конце концов, если вы решаете, какую версию использовать, я бы рекомендовал использовать один оператор var без присваивания:

function () {
    var a,
        b,
        c,
        foo,
        bar,
        fizz,
        buzz;
    a = 1;
    ...
    b = 3;
}

Причина этого в том, что именно так будет выполняться код из-за поднятия переменной. Затем я могу переместить оператор инициализации так, чтобы эта переменная использовалась впервые, например, в цикле for:

function foo(arr) {
    var i,
        l;
    ...
    for (i = 0, l = arr.length; i < l; i++) {
        doStuff(arr[i]);
    }
    ...
}
0 голосов
/ 12 марта 2012

Это похоже на преждевременную оптимизацию, корень всего зла.

Сколько раз оно будет выполнено?Какая часть всей программы будет потребляться?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...