Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Bruno M Duarte

Diferença entre escrever funções.

Recommended Posts

Olá pessoal! Bom dia!

A minha dúvida de hoje é o seguinte.

 

Eu me deparei com umas formas diferentes de escrever funções em jquery e gostaria de entender melhor o que cada uma faz, então peço a ajuda de alguém que tenha conhecimento nessa área.

 

Qual é a diferença entre as funções abaixo?

Exemplo: 1.

$(function(){
    //codigo...
});  

Exemplo:2.

(function($){
   //codigo...
})(jQuery);

Exemplo:3.

$.fn.nome_da_funcao = function( parametro ){
   //codigo...
};

Exemplo:4.

jQuery.fn.nome_da_funcao = function( parametro ){
   //codigo...
};

Desede já agradeço a ajuda. :joia:

Compartilhar este post


Link para o post
Compartilhar em outros sites

3 e 4 são exatamente a mesma coisa.

 

1 e 2 são muito diferentes.

 

Isso aqui:

$(function(){
    //codigo...
}); 
é exatamente o mesmo que

$(document).ready(function(){
    //codigo...
}); 
O primeiro é apenas um atalho para a forma completa. Os desenvolvedores do jQuery deixaram assim, para ter que digitar menos. Mas essas 2 formas q mostrei, fazem a mesma coisa.

 

O intuito do document.ready é esperar o DOM carregar, ou seja, é o callback enviado pelo evento DOMContentLoaded, que acontece antes do window.onload.

O window.onload espera tudo carregar, js, imagem, html, css..

e o DOMContenteLoaded espera apenas o HTML estar pronto(por isso acontece antes).

 

 

Quanto ao

(function($){
   //codigo...
})(jQuery);
isso é uma função anônima autoexecutável. E não faz nada do que o document.ready faz. Essa apenas dá um apelido do jQuery para $, para evitar conflito com outras libs, que também usam o $, como o mootools, prototype..

Compartilhar este post


Link para o post
Compartilhar em outros sites

Exemplo: 1.

$(function(){
    //codigo...
});  

 

É uma maneira mais curta de escrever:

$(document).ready(function(){
    //codigo...
});
A função vai ser chamada quando os elementos da página estiverem pronto para uso.

 

Exemplo:2.

(function($){
   //codigo...
})(jQuery);

 

Essa sintaxe é usada no Javascript para executar uma função assim que a mesma for carregada:

(function(n1, n2){
   //codigo...
   alert(n1 + n2);
})(25, 30);
Acima eu criei uma função que recebe dois argumentos e da "alert" na soma dos dois valores, eu isolei ela com parênteses e ao final eu chamo ela passando "25" e "30" como valores.

 

Que também pode ser algo como:

// declaro a função
var somar = function(n1, n2){
   //codigo...
   alert(n1 + n2);
};
somar(25, 30);

Exemplo:3.

$.fn.nome_da_funcao = function( parametro ){
   //codigo...
};

 

É usado para adicionar funções ao núcleo do jQuery, também pode ser:

jQuery.fn.alert = function(){
   //codigo...
   alert(this);
};
$('body').alert(); // uso a função que criei no body

Exemplo:4.

jQuery.fn.nome_da_funcao = function( parametro ){
   //codigo...
};

 

Mesma coisa do 3.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.