O JavaScript é muito dinâmico hoje em dia, mas ainda vejo muito código legado, seja para otimizar a compatibilidade com versões anteriores ou simplesmente porque o código não foi mantido. Uma das práticas que me deixa encolhido é a codificação que cria efeitos colaterais indesejados. O que é um efeito colateral? Um trecho de código em que uma variável é criada e está disponível em um escopo quando não precisa estar. Vou mostrar aos senhores alguns exemplos e como evitar esses efeitos colaterais indesejados.


Array.prototype.forEach() em vez de for(var x = ...)


O looping em uma matriz JavaScript era tradicionalmente feito por meio de um for() loop:



var myArray = [1, 2, 3];

for(var x=0, length = myArray.length; x < length; x++) {
	// ...
}

// "x" and "length" are side effects


O efeito colateral desse padrão é, no mínimo, o índice de execução, se não o comprimento também – eles estão disponíveis em todo o escopo. Array métodos de protótipo como map, forEach, e every permitem que o desenvolvedor evite esses efeitos colaterais:



[1, 2, 3].forEach(function(item, index, array) {
	// No side effects! :)
});


Nenhuma variável “utilitária” precisa ser criada para o looping, evitando assim efeitos colaterais. Isso é chamado de programação “funcional”.


Funções autoexecutáveis


Se o senhor não leu Escondendo suas informações pessoais com JavaScripte o senhor não sabe como manter variáveis privadas em JavaScript, reserve alguns minutos para lê-lo. O mesmo padrão fornecido nessa publicação permite que o senhor evite efeitos colaterais por meio de funções autoexecutáveis:



// Example from MooTools source...

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;
	});

})();

// The three vars are stuck in the self-executing function, they don't "leak" out


A essência é que o senhor pode fazer um monte de processamento dentro da função autoexecutável (um novo escopo) sem permitir o vazamento de variáveis – o único item retornado ou vazado é o valor de retorno desejado.


O aprimoramento do seu código inclui evitar efeitos colaterais, e o JavaScript facilita isso se o senhor seguir essas práticas básicas!