Шаблон Модуль в javascript

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

Как выглядит?

В общем случае код модуля выглядит так:

;(function () {

	//тут код модуля

})();

Сразу пояснение: символ ; в начале кода необходим для предотвращения возможной ошибки. Если вдруг случится так, что при минификации нескольких js-файлов были объединены в один, и в предыдущем файле программист не поставил точку с запятой в конце своего кода, то получился ошибка. То есть, в ситуации, когда первый файл a.js содержит:

var simple = 2

а второй файл b.js содержит код модуля:

//в начале нет ;

(function () {

	//тут код модуля

})();

и после объединения получится:

var simple = 2

//в начале нет ;

(function () {

	//тут код модуля

})();

То при запуске данного кода получится ошибка из-за отсутствующей точки с запятой. Интерпретатор js-кода будет видеть такой код:

var simple = 2(function () {})(); // вернет TypeError: 2 is not a function

и попытается вызвать 2 как функцию, что и приведет к ошибке. В случае, если бы ; стояла перед модулем - этого бы не было:

var simple = 2;(function () {})(); // undefined - все нормально

Вот такая защита от дурака.

Использование

Лучше всего понимается на примерах. Пример ниже четко показывает обособленность переменных внутри модуля(инкапсуляция):

var message = "Привет, я из глобального контекста!";

console.log(message); // выведет: Привет, я из глобального контекста!

;(function () {

	console.log(message); // выведет: undefined

	var message = "Привет, я из модуля!";

	console.log(message); // выведет: Привет, я из модуля!

})();

console.log(message); // выведет: Привет, я из глобального контекста!

Также результат выполнения модуля можно экспортировать в глобальный контекст. Например, ниже будет экспортирована функция с переменной, недоступной снаружи:

var showMessage = (function () {

	var message = "Привет, я из модуля!";



	return function () {

		alert(message);

	}

})();

showMessage();

Вот и получается, что хотя модуль всего-лишь функция обертка, но как много значит для разработки на js.

В качестве примера использования этого подхода для создания модуля можно привести самую известную библиотеку - jQuery.