Самовызывающиеся функции в jQuery(function() {})

#jquery #javascript

Может ли кто нибудь объяснить для чего нужны самовызывающиеся функции внутри jQuery(function()
{})? Насколько я понимаю вообще они нужны для того, чтобы не засорять глобальный объект.
Однако когда я пишу код таким образом:
jQuery(function() {
  console.log(document === this) // true
  var testVar = 123;
})
typeof testVar; //undefined
typeof document.testVar; //undefined

Моя переменная testVar нигде не появляется (имею ввиду что насколько я понимаю контекстом
функции является объект document, но после задания преременной testVar и отрабатывания
функции в объекте document не появляется новая переменная).
Вопрос: имеется ли в самовызывающихся функциях внутри jQuery(function() {}) какой
нибудь смысл?    

Ответы

Ответ 1

jQuery(function() {}) или $(function(){}) функция сработает после загрузки DOM дерева.
Обычно манипуляция с элементами DOM дерева делается после загрузки всей страницы. Этот код:

typeof testVar; //undefined
typeof document.testVar; //undefined


сработает раньше этого кода:

jQuery(function() {
  console.log(document === this) // true
  var testVar = 123;
}) 


Переменная var testVar = 123;будет видна только у функции которой она била объявлена,
если сделать так window.testVar = 123; она будет доступна в глобальной области видимости.

Пример:



    
    






Ответ 2

имеется ли в самовызывающихся функциях внутри jQuery(function() {}) какой нибудь смысл?


Они ну никак не самовызывающиеся. Где ты скобки вызва нашёл?

Эти функции передаются в jQuery, который их вызывает, когда загрузится документ.