2

Стажируюсь в компании на фронтенд-разработчика, пришел с строготипизированной джавы, и некоторые моменты мне не очевидны, а именно:

Объявление функции в js может быть двух видов:

function a(){...}

либо

var a = function(){...}

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

Быть может, влияет на работу GC?

Более предпочтителен развернутый ответ, нечто вроде "это одно и то же" - ответом являться не будет.

Заранее спасибо.

2 ответа 2

7

В JS функция является значением, таким же как строка или число. Function Declaration – функция, объявленная в основном потоке кода. Пример:

function a(){...}

Function Expression – объявление функции в контексте какого-либо выражения, например присваивания. Пример:

let a = function(){...}

Основное отличие между ними: функции, объявленные как Function Declaration, создаются интерпретатором до выполнения кода.

Поэтому их можно вызвать до объявления, например:

Hello("World"); // Привет, Вася

function Hello(name) {
  alert( "Hello, " + name );
}

А если бы это было объявление Function Expression, то такой вызов бы не сработал:

Hello("World"); // ошибка!

let Hello= function(name) {
  alert( "Hello, " + name );
}

Это из-за того, что JavaScript перед запуском кода ищет в нём Function Declaration (их легко найти: они не являются частью выражений и начинаются со слова function) и обрабатывает их.

А Function Expression создаются в процессе выполнении выражения, в котором созданы, в данном случае – функция будет создана при операции присваивания Hello = function... В большинстве случаев обычное объявление функции (Function Declaration) – лучше. Function Expression желательно использовать только там, где это действительно нужно и удобно.

3

Разница в том, когда можно использовать функцию:

function justForContext() {

  console.log(a);
  console.log(b);

  a();
  try{b();}catch(e){console.log("error calling b");}

  function a() {
    console.log("inside a");
  }
  var b = function() {
    console.log("inside b");
  }

  console.log(b);
  b();

}

justForContext();

а готово к использованию везде в области видимости, а b - после присваивания.

4
  • Еще можно стрелочные функции использовать: var c = ()=>console.log("arrow function");, но это только в ES6 или при использовании транслятора.
    – Bleser
    30 апр 2017 в 6:33
  • Дружище, твой код очень краток, доступен и понятен, поначалу хотел тебе ответ поставить, только ограничение мешало - но парень выше постарался и расписал, так что не в обиду, ему репа больше нужна, но оба ответа очень годные, спасибо.
    – Silento
    30 апр 2017 в 6:33
  • 1
    @Silento - "Понимаем." Tоварищ Сухов "Белое солнце пустыни" :)
    – user176262
    30 апр 2017 в 6:38
  • стрелочная функция не везде подойдет, в простых примерах да, но при работе с прототипами могут появиться сложности. я вместо var используюlet. Это ведь тоже новый стандарт) просто достаточно вначале всего скрипта поставить 'use strict'и все будет ок)' 30 апр 2017 в 7:06

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.