Какова цель упаковки целых файлов Javascript в анонимные функции, такие как «(function () {…}) ()»?

Обычно это пространство имен (см. Ниже) и управление видимостью функций-членов и / или переменных. Думайте об этом как об определении объекта. Плагины jQuery обычно пишутся так.

В Javascript вы можете вкладывать функции. Итак, следующее допустимо:

function outerFunction() {
   function innerFunction() {
      // code
   }
}

Теперь вы можете вызвать outerFunction () , но видимость innerFunction () ограничена областью outerFunction () , что означает, что он является частным для outerFunction () . В основном он следует тому же принципу, что и переменные в Javascript:

var globalVariable;

function someFunction() {
   var localVariable;
}

Соответственно:

function globalFunction() {

   var localFunction1 = function() {
       //I'm anonymous! But localFunction1 is a reference to me!
   };

   function localFunction2() {
      //I'm named!
   }
}

В приведенном выше сценарии вы можете вызвать globalFunction () из любого места, но вы не можете вызвать localFunction1 или localFunction2 .

Когда вы пишете (function () {... code ...}) () , вы создаете код внутри функционального литерала (то есть всего " объект "на самом деле является функцией). После этого вы вызываете функцию самостоятельно (последняя () ). Таким образом, основным преимуществом этого, как я уже упоминал ранее, является то, что вы можете иметь частные методы / функции и свойства:

(function() {
   var private_var;

   function private_function() {
     //code
   }
})()

В первом примере globalFunction () была публичной функцией, которую можно было вызвать для доступа к общедоступным функциям, но в приведенный выше пример, как вы это называете? Здесь функция самозапуска заставляет код автоматически запускаться при запуске. Так же, как вы можете добавить initMyStuff (); на вершину любого.js, и он будет автоматически запускаться как часть глобальной области видимости, эта самозапускающаяся функция также будет запускаться автоматически, хотя, поскольку это безымянная функция, ее нельзя вызывать несколько раз, как это может быть initMyStuff ().

Замечательно то, что вы также можете определять вещи внутри и открывать их для внешнего мира, поэтому (пример пространства имен, чтобы вы могли создать свою собственную библиотеку / плагин):

var myPlugin = (function() {
 var private_var;

 function private_function() {
 }

 return {
    public_function1: function() {
    },
    public_function2: function() {
    }
 }
})()

Теперь вы можете вызвать myPlugin .public_function1 () , но вы не можете получить доступ к private_function () ! Это очень похоже на определение класса. Чтобы лучше понять это, я рекомендую следующие ссылки для дальнейшего чтения:

• Размещение имен в Javascript
• Частные члены в Javascript (Дуглас Крокфорд)

РЕДАКТИРОВАТЬ

Я забыл упомянуть. В этом последнем () вы можете передать все, что захотите. Например, когда вы создаете плагины jQuery, вы передаете jQuery или $ следующим образом:

(function(jQ) { ... code ... })(jQuery) 

Итак, вы определяете функцию, которая принимает один параметр ( называется jQ , локальной переменной и известна только этой функции). Затем вы вызываете функцию самостоятельно и передаете параметр (также называемый jQuery , но этот относится к внешнему миру и является ссылкой на сам jQuery). В этом нет необходимости, но есть некоторые преимущества:

• Вы можете переопределить глобальный параметр и дать ему имя, которое имеет смысл в локальной области.
• Существует небольшое преимущество в производительности, так как быстрее искать вещи в локальной области видимости вместо того, чтобы идти вверх по цепочке областей видимости в глобальную область видимости.
• Есть преимущества для сжатия (минификации).

Ранее я описал, как эти функции запускаются автоматически при запуске, но если они запускаются автоматически, кто передает аргументы? Этот метод предполагает, что все параметры определены как глобальные переменные. Поэтому, если jQuery не был определен как глобальная переменная, этот пример не работал бы и не мог бы быть вызван другим способом, поскольку наш пример является анонимной функцией. Как вы могли догадаться, во время инициализации jquery.js определяет глобальную переменную jQuery, а также более известную глобальную переменную $, которая позволяет этому коду работать после включения jquery.js.