1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

var interval = (function(){
 
	var ids = {}, names = {};
 
	return {
		add: function(name, timer, fn) {
			var interval = setInterval(fn, timer);
			ids[interval] = name;
			names[name] = interval;
		},
		stop: function(name) {
			clearInterval(names[name]);
		}
	}
 
})();

A utilização aconteceria mais ou menos assim:

1
2
3
4
5
6

function coisas_legais() {
   alert('Função legal');
 
}
 
interval.add('invervalo_legal', 300, coisas_legais);

Para parar a execução deste intervalo:

1

interval.stop('intervalo_legal')

1
2
3
4
5
6

$.fn.extend({clickPrevented: function(fn) {
	$(this).click(function(e) {
		e.preventDefault();
		fn(e);
	});
}});

A utilização aconteceria mais ou menos assim:

1
2
3

$('#apenas_um_cara').clickPrevented(function(){
        alert('Você vai continuar nesta página após o alert.');
});

1
2

var valor = '020';
alert(parseInt(valor, 10));

Pra que serve o segundo parâmetro?

Esta função tem uma “funcionalidade” complicada. Se a string começar com “0″ ela vai ser convertida utilizando base 8 (sistema octal) ao invés de base 10. O segundo argumento determina qual base numérica deve ser utilizada. A string 20 seria convertida para o número octal 16. Veja o que acontece quando omitimos o segundo parâmetro:

1
2

var valor = '020';
alert(parseInt(valor));

É, portanto, boa prática sempre utilizar o segundo argumento para evitar qualquer transtorno. Ou, se você quiser treinar funções anônimas, a seguinte brincadeira também é possível:

1
2
3
4
5
6
7
8
9
10

(function(){
	var original = parseInt;
	parseInt = function(n, b) {
		b = b || 10;
		return original(n, b);
	};
})();
 
var valor = '020';
alert(parseInt(valor));

Esse fragmento de código só precisa ser executado uma vez (no seu init.js, por exemplo). Repare que se você rodar o exemplo 2 novamente, o resultado já será o correto. O que fizemos foi reescrever a função parseInt usando ela mesma.

Funções como argumentos

1
2
3
4
5
6
7
8
9
10

function imprimir(fn) {
    var texto = fn();
    alert(texto);
}
 
function gerador() {
    return 'Sou um texto!';
}
 
imprimir(gerador);

Neste primeiro exemplo, declaramos uma função chamada “imprimir” que espera como argumento uma outra função. Ela executa esta outra função, pega o seu retorno e passa ele como argumento de “alert”.

É importante perceber que na linha 10 “gerador” é passado como argumento sem os parênteses “()” no final. Ou seja, ela não está sendo invocada, somente passada. A execução da função ocorre na linha 2. Uma variação do nosso exemplo:

1
2
3
4
5
6
7
8
9
10
11
12
13

function imprimir(fn) {
    var texto = fn('por');
    alert(texto);
}
 
function gerador(lingua) {
    if (lingua === 'por') {
        return 'Sou um texto!';
    }
    return 'I´m a text!';
}
 
imprimir(gerador);

Agora “gerador” espera um parâmetro “lingua”. Este parâmetro é passado por “imprimir” no ato da execução, linha 2.

Funções anônimas

O nome pode parecer estranho mas o conceito é bem simples: funções anônimas são funções que não tem nome:

1
2
3
4
5
6
7
8
9
10
11

function imprimir(fn) {
    var texto = fn('por');
    alert(texto);
}
 
imprimir(function(lingua) {
    if (lingua === 'por') {
        return 'Sou um texto!';
    }
    return 'I´m a text!';
});

“Imprimir” continua sendo exatamente igual. Aguarda uma função como parâmetro. A diferença é que, ao invocarmos “imprimir”, declaramos uma função anônima ao mesmo tempo. Como ela não tem nome, não existe a possibilidade dela ser executada por uma outra função ou em outro momento do código. Somente “imprimir” a contém e pode executá-la.

E pra quê serve isso?

Funções como argumentos e funções anônimas são amplamente utilizadas como “callbacks”. Se você atrela um evento de click a um botão, algo deve acontecer quando este botão for clicado. Este “algo” é uma função. Ou então uma requisição Ajax. Vamos supor que temos uma requisição que busca se um determinado email já foi ou não cadastrado em um banco de dados. Quando a requisição finalmente termina, uma resposta é enviada ao nosso programa. Esta resposta é normalmente passada como argumento de uma função “callback”.

1
2
3
4

// exemplo-1
function a() {
    alert('Olá, sou a função.');
}

O fragmento de código acima não realiza nenhuma tarefa. A função de nome a foi apenas declarada e está pronta para ser utilizada. Para que algo aconteca precisamos invocar, chamar a função. Isso por ser feito da seguinte maneira:

5

a();

Se adicionarmos a linha acima ao nosso código, um alerta aparecerá no navegador exibindo a mensagem “Olá, sou uma função”.

E para que servem as funções? (argumentos)

Quando um programa de alguma complexidade maior é desenvolvido, problemas recorrentes tornam-se evidentes. Tarefas repetitivas que podem ser identificadas, isoladas e codificadas em funções. Vamos alterar nosso código para o seguinte:

1
2
3
4

// exemplo-2
function a(texto) {
    alert(texto);
}

A função a agora recebe o que é chamado de argumento. Este argumento tem um nome: texto. Novamente, nosso código é inútil enquando não for acionado.

5

a('Sou um exemplo de texto.');

Mais uma vez um alerta pipoca na tela no navegador, desta vez com a mensagem “Sou um exemplo de texto”. Perceba como isso é importante. Nossa função agora comporta-se de maneira diferente dependendo do argumento que lhe é passado. Nessa altura nossa função não é nem um pouco útil. Ela nada mais é do que uma espécie de “atalho” para um outra função: alert. Ambas desempenham a mesma tarefa. Vamos então modificar a função para que ela realize algo um pouco diferente:

1
2
3
4
5

// exemplo-3
function a(texto) {
    alert('O argumento passado foi: ' + texto);
}
a('um exemplo de texto.');

O resultado do exemplo 3 é: O argumento passado foi um exemplo de texto. A função continua utilizando alert, mas agora ela realiza uma tarefa um pouco mais complexa.

É possível afirmar então que funções são pedaços de código que desempenham tarefas muito parecidas, mas de maneira um pouco diferente dependendo do jeito que as acionamos. O que faz a função se comportar de forma diferente é o contexto. O contexto, nos exemplos acima, é dado pelo argumento que é pasado no momento da invocação da função.

Sobre os retornos de funções

Como já foi dito, funções podem ter nomes, receber argumentos, desempenhar uma tarefa e retornar algum resultado.

1
2
3
4
5

// exemplo-4
function a(texto) {
    return 'O argumento passado foi: ' + texto;
}
alert(a('um exemplo de texto.'));

Este exemplo se comporta de maneira igual ao anterior. Alert é chamada e recebe como argumento o retorno da função “a”. Como “a” está dentro de “alert” ela é executada primeiro. Desta forma, quando alert é chamada já temos o resultado de “a” disponível, que é passado como argumento para “alert”.

É possível pensar na sequência de operações da seguinte forma: “alert” é invocada, invoca “a”, que retorna um resultado, que é passado como argumento o argumento de “alert”.

É muito importante entender que o retorno não somente retorna um resultado. Ele também pára a execução da função.

1
2
3
4
5
6

// exemplo-5
function a(texto) {
    return;
    alert('O argumento passado foi: ');
}
a('um exemplo de texto.');

Neste caso nada acontece no navegador. Na linha 3 nossa função, invocada na linha 5, não retorna nenhum valor. Ou seja, ela para de ser executada. Esta função é inútil porque ele não desempenha nenhuma tarefa. Em nenhuma circunstância chegaremos na linha 4. É um exemplo besta mas serve para ilustrar que retornos podem ou não retornar um valor, mas sempre interrompem a execução da função.