zapis kodu podobny do zapisu wtyczki jQuery

Pytanie być może kwalifikuje sie do newbie, jeśli tak, to przenieście. Tytuł też może nie jest najlepszy, ale nie wiedziałem jak go poprawnie sformułować. Chodzi mi o coś takiego:

(function(jQuery){
	
})(jQuery);

Mógłby mi ktoś powiedzieć coś więcej na temat tego zapisu? Z tego co wywnioskowałem metodą prób i błędów, to zmienne zadeklarowane w takim bloku kodu są niewidoczne z zewnątrz. Nawet jeśli zostanie utworzony drugi identyczny taki blok kodu, to nie będzie miał dostępu do zmiennych z pierwszego bloku. Tyle sam wiem, ale proszę was o bardziej szczegółowe wyjaśnienie tego zapisu.

To co napisałeś pod koniec posta jest prawdą.

Z małym wyjątkiem: to nie jest "blok", tylko po prostu funkcja. Różnica trochę istotna, bo w JavaScripcie nie ma zasięgu blokowego.

To, co masz w tym fragmencie kodu, to po prostu funkcja anonimowa, która jest natychmiast uruchamiana. Ten kod jest niemal równoważny czemuś takiemu:

function cośtam(jQuery) {

}

cośtam(jQuery);

Czyli tworzymy funkcję i linijkę niżej ją uruchamiamy. Ponieważ nie mamy zamiaru uruchamiać tej funkcji wielokrotnie, nie potrzebujemy jej nadawać nazwy cośtam. Lepiej w takim wypadku pominąć nazwę funkcji, bo nie chcemy zaśmiecać globalnej przestrzeni nazw niepotrzebnymi funkcjami (inni programiści musieliby uważać żeby nie nadpisać naszej nazwy i vice versa).

Rozwiązaniem jest właśnie zastosowanie funkcji anonimowej, czyli funkcji bez nazwy. Taką funkcję można przekazać jako parametr albo po prostu natychmiast odpalić, tak jak masz w Twoim kodzie.

Ten kod jest jednak ździebko bez sensu jeśli chodzi o argument jQuery, co widać w tym przykładzie, który dałem powyżej. Po co w ogóle przekazujesz tam parametr jQuery, skoro poza funkcją, tj. globalniemasz już zdefiniowaną nazwę jQuery (siedzi tam oczywiście biblioteka jQuery)? Możesz spokojnie użyć tej globalnej zmiennej jQuery, nie musisz definiować parametru o tej samej nazwie i przekazywać funkcji biblioteki jQuery.

Czyli mógłbyś to skrócić do tego zapisu i wyszłoby na to samo:

(function(){
 // tu nazwa jQuery jest też zdefiniowana,
})();

ALE... Ten parametr się czasem przydaje. Jest kilka bibliotek, które definiują funkcję o nazwie $. jQuery też taką funkcję definiuje jako skrót, dzięki czemu nie musimy pisać jQuery("#foo").addClass("bar"), tylko piszemy $("#foo").addClass("bar"). Ale jeśli na stronie mielibyśmy kilka różnych bibliotek, to inna z bibliotek mogłaby nadpisać tę funkcję $.

Jeśli w naszej funkcji anonimowej chcemy korzystać z nazwy $ jako skrótu dla jQuery, to wtedy przydaje nam się zdefiniowanie parametru formalnego o nazwie $ i przekazanie parametrowi obiektu jQuery, o tak:

(function($){
  // tu możemy się bezpiecznie odnosić do jQuery
  // za pomocą $, np.:
  $("#coś").addClass("klasa");
})(jQuery);

Nie ma w znaku $ niczego specjalnego. Jeśli np. lubimy wiewiórki, to moglibyśmy użyć słowa wiewiorka jako nazwy parametru formalnego naszej funkcji anonimowej. I wtedy do jQuery odnosilibyśmy się wewnątrz tej funkcji poprzez nazwę wiewiorka:

(function(wiewiorka) {
  wiewiorka("#coś").addClass("klasa");
})(jQuery);

Wracając do wersji ze znakiem dolara: moglibyśmy praktycznie to samo zapisać w poniższy sposób:

(function() {
  var $ = jQuery;
  $("#coś").addClass("klasa");
})();

Tylko to jest odrobinkę bardziej rozwlekłe, bo musimy napisać słowo "var" ;).