@neodekvat09

Объясните, зачем нужна анонимные самовызов. функции и замыкания?

Здравствуйте, недавно начал изучать js (до этого лишь вёрсткой, да и php увлекался). Вроде как всё получается, только с пониманием и самой практикой туговато.
Объясните пожалуйста, зачем нужны анонимные самовызовающиеся функции (насколько я сам понял, это функции, которые нужно выполнить единожды, и чтобы к локальным переменным этой anon self-invoking func нельзя было получить доступ, но опять же, я не до конца понимаю зачем, лишь в целях безопасности и сохранения оперативной памяти ?), и замыкания, зачем они, где можно применить на реальном примере ?

P.S. Прошу прощения за столь глупые вопросы, но правда, самого понимания пока что не могу найти, а во всяких видео-уроках зачастую просто говорят что она/они делают и т.п.
  • Вопрос задан
  • 6094 просмотра
Решения вопроса 2
Засорять глобальную область видимости нехорошо, потому что сложно следить, чтобы эти имена не пересекались в разных файлах, не использовались и не перезаписывались там, где не нужно. Например, если нужно вывести алертом сумму двух чисел numberOne и numberTwo:
// глобальная функция add складывает все элементы массива
function add(arr) {
  return arr.reduce(function(a, b) {return a + b})
}

(function(a, b) {
  // локальная функция add складывает два числа
  function add(a, b) {
    return a + b
  }

  var sum = add(a, b)

  alert(sum)
})(numberOne, numberTwo)

Этот пример, конечно, искусственный (потому что на самом деле alert(numberOne + numberTwo)), но если заменить сложение и алерт на какие-то более-менее объёмные вычисления, то тот факт, что мы не перезаписываем глобальные функции (как в примере было бы с функцией add, если бы мы не обернули код в анонимную функцию), не засоряем глобальную область видимости счётчиками циклов и т. д., может предотвратить некоторые ошибки.

На счёт замыканий -- например, нам нужно написать функцию, которая принимает ID HTML элемента и строку и добавляет ему event listener, который при нажатии на элемент алертит эту строку:
function foo(id, msg) {
  document.getElementById(id).addEventListener("click", function() {
    alert(msg)
  }
}

Здесь функция, которую мы передаём в addEventListener, и которая будет выполнятся при нажатии на элемент, берёт значение переменной msg из области видимости внешней функции -- это и есть замыкание.

Ещё один пример с замыканием:
function add(a) {
  return function(b) {
    return a + b
  }
}

add(5)(6)  // 11

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

Объясняется в книге Марейна Хавербека, вскользь, но на пальцах.

Много интересного по части функций можно найти в книге Стояна Стефанова "Шаблоны" в разделе Функции, также в разделе Шаблоны создания объектов "Частные свойства и методы".

Функции на самом деле в js очень много интересного выполняют, создаётся объект prototype, arguments, происходит подъём всех переменных в начало функции, создаётся объект для хранения локальных переменных функции во время её вызова, также функции создают так называемую "локальную область видимости", при вызове функции используется лексическая область видимости, функции потенциально являются конструкторами, с помощью функций создаётся пространство имён(модули) и это далеко не полный перечень, поэтому уделите функциям большое внимание.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
AMar4enko
@AMar4enko
Чтобы понять, зачем нужны замыкания, попробуйте написать на JS что-либо более-менее серьезное без них.
IIFE используются в основном для предотвращения уплывания объявляемых в файле переменных в глобальную область видимости.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы