Есть ли разница между var name = function() {} & function name() {} в Javascript?

Возможный дубликат:
JavaScript: var functionName = function() {} vs function functionName() {}

Предположим, что мы находимся внутри функции, а не в глобальном пространстве имен.

function someGlobalFunction() {
  var utilFunction1 = function() {
  }

  function utilFunction2 () {
  }

  utilFunction1();
  utilFunction2();

}

Являются ли эти синонимы? Неужели эти функции полностью перестают существовать, когда возвращается someGlobalFunction? Должен ли я предпочесть один или другой для удобочитаемости или по какой-либо другой причине?

Ответ 1

Они в основном одинаковы.

utilFunction1 будет доступен только после его объявления. utilFunction2 поднимается в начало функции, поэтому его можно использовать до его определения.

function someGlobalFunction() {
  utilFunction1(); // Error: untilFunction1 is undefined :(
  utilFunction2(); // Works

  var utilFunction1 = function() {
  }

  function utilFunction2 () {
  }
}

Если они не оказались в ловушке закрытия, оба они перестанут существовать, когда someGlobalFunction вернется.

Я предпочитаю использовать метод, объявленный utilFunction2, но это зависит от вас.

Объявления формы utilFunction2 (которые называются декларациями функций) имеют преимущество имени (т.е. отображаться как utilFunction2) в вашем-любимом-отладчике ^TM где в качестве utilFunction1 (называемые функциональными выражениями) будет отображаться как анонимная функция.

Для полноты вы также имеете форму;

var utilFunction3 = function utilFunction4() {
    // blah
};

... который называется именованным функциональным выражением, которое странные свойства (и bugs (в более старых версиях IE)).

Ответ 2

Да, они совершенно разные:

utilFunction1 не имеет имени, поэтому, если он выдает исключение, ваш инструмент отладки будет только сообщать вам, что анонимная функция запустила
utilFunction2 будет доступен в объеме функции еще до того, как эта линия будет достигнута (как отметил fletcher)
с использованием нотации utilFunction2 может привести к нечетному поведению в определенных обстоятельствах в IE.

Пример:

if (true) {
  function utilFunction() {
    return true;
  }
} else {
  function utilFunction() {
    return false;
  }
}

utilFunction(); // returns false in IE, true everywhere else

IE очень сильно затрагивает проблему области действия функции, эффективно оценивая функции, даже если для них нет пути к ним!

Ответ 3

Поздравляем! Вы нашли ситуацию, в которой задействовано функция Подъем.

var foo = function() { };

сильно отличается от

function foo() { };

По всем причинам, указанным в другом месте, плюс один.

Второй пример будет "поднят" - он будет доступен в любой точке текущего закрытия (обычно это текущая функция). Даже до того, как оно будет объявлено в пределах указанного закрытия.

Что-то вроде этого будет работать:

function foo() {
    bar();
    function bar() { alert('baz'); }
}

В то время как что-то вроде этого наиболее определенно не будет:

function foo() {
    bar();
    var bar = function bar() { alert('baz'); };
}

В этом втором примере вы получите сообщение об ошибке, поскольку барин еще не определен. Если вы замените две строки в функции foo, этот пример будет работать.

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