Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
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:
>
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.
Vlw galera entendi como funciona, agradeço a ajuda
Até a aproxima .
3 e 4 são exatamente a mesma coisa.
1 e 2 são muito diferentes.
Isso aqui:
}); é exatamente o mesmo que }); 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
})(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..