Избегаем побочных эффектов в JavaScript

Избегаем побочных эффектов в JavaScript

От автора: В настоящее время JavaScript развивается очень динамично, но я до сих пор сталкиваюсь с большим количеством устаревшего кода, написанного либо в целях оптимальной обратной совместимости, либо просто неподдерживаемого. Одна из практик написания кода, которая меня просто раздражает, заключается в создании нежелательных побочных эффектов. Что такое побочный эффект? Это кусок кода, в котором созданная переменная становится доступной из глобальной области видимости, хотя этого не было задумано. Позвольте мне показать вам несколько примеров и научить, как избегать нежелательных побочных эффектов.

Array.prototype.forEach() instead of for(var x = ...)

Традиционно перебор элементов массива в цикле осуществлялся в JavaScript с помощью цикла for():

var myArray = [1, 2, 3];
for(var x=0, length = myArray.length; x < length; x++) {
	// ...
}
// переменные "x" и "length" являются побочными эффектами

В данном случае побочным эффектом будет, как минимум, индекс для перебора элементов (а, возможно, также и длина массива), т.е. это переменные, которые доступны из глобальной области видимости. Методы прототипа объекта Array, например, map, forEach и every позволяют разработчикам избежать подобных побочных эффектов:

[1, 2, 3].forEach(function(item, index, array) {
	// Побочных эффектов нет!
});

Теперь для перебора элементов массива в цикле не требуется создавать никаких «полезных» переменных. Это называется «функциональным» программированием.

Самовызывающиеся функции

Если вы не читали статью Скрываем приватные данные в JavaScript и вы не знаете, как создавать приватные переменные в JavaScript, то вам все-таки стоит выделить несколько минут на ее прочтение. Тот же самый подход, описанный в статье, позволит вам избежать побочных эффектов с помощью самовызывающихся функций:

// Пример исходного кода библиотеки MooTools...

Browser.Request = (function(){

	var XMLHTTP = function(){
		return new XMLHttpRequest();
	};

	var MSXML2 = function(){
		return new ActiveXObject('MSXML2.XMLHTTP');
	};

	var MSXML = function(){
		return new ActiveXObject('Microsoft.XMLHTTP');
	};

	return Function.attempt(function(){
		XMLHTTP();
		return XMLHTTP;
	}, function(){
		MSXML2();
		return MSXML2;
	}, function(){
		MSXML();
		return MSXML;
	});

})();

// Три переменные помещены в самовызывающуюся функцию, поэтому они не могут «просочиться» наружу

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

Улучшение вашего кода включает также стремление избегать побочных эффектов, и вы можете легко этого достичь в JavaScript, если будете следовать лучшим традициям!

Автор: David Walsh

Источник: http://davidwalsh.name/

Редакция: Команда webformyself.

JavaScript&jQuery с нуля до профи

Пройдите пошаговый видеокурс по JavaScript&jQuery

Научиться

Метки:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Я не робот.

Spam Protection by WP-SpamFree