2012-02-01 17 views
44

czytałem źródeł JS z Twittera — na drodze do poprawy mojej wiedzy JS, gdy natknąłem się na dziwny sposób wywoływania anonimową funkcję:JavaScript anonimowy wywołanie funkcji

!function($) { 
    ... 
}(window.jQuery); 

... i to działa ! :)

To oczywiste dla wszystkich, że w ten sposób:

function ($) { ... } (window.jQuery) 

nie działa (błąd składni), natomiast ta jest poprawna:

(function ($) { .... })(window.jQuery) 

Może ktoś proszę wyjaśnić tę magię (dlaczego sprawa z !function działa)?

+1

Zobacz http://benalman.com/news/2010/11/immediately-invoked-function-functionion/ dla innych ważnych wzorów IIFE. –

+1

@AtesGoral, dziękuję, ten artykuł jest bardzo przydatny. –

Odpowiedz

61

Gdy kluczowe function spełniony jest w stanie rachunku (jako pierwszy wyraz w oświadczeniu), deklaracja funkcja jest wyrażona jako oświadczenie funkcji. Instrukcje funkcji są podnoszone do góry zakresu, nie mogą być natychmiast wywoływane i muszą mieć nazwę.

Kiedy słowo kluczowe jest spełniony w położeniu wyrażenie (czyli nie jako pierwszy wyraz w oświadczeniu, w przykładzie ! to pierwszy znak), deklaracja funkcja jest wyrażona jako wyrażenie funkcji, które mogą być anonimowy i zwraca wartość nowo utworzonej funkcji. Ponieważ zwraca wartość nowo utworzonej funkcji, możesz od razu wywołać ją, dodając nawias po niej.

Owijanie deklaracja wewnątrz nawiasu robi to samo, ale jest bardziej powszechne niż poprzedzając go z ! lub +:

(function() { 
    ... 
}()); 
+3

Prawdopodobnie użyli! zamiast owijać go w(), ponieważ używa 50% mniej znaków. :) Mniejsze przechodzenie przez przewód = szybsze czasy ładowania. – jinglesthula

0

Jeśli chodzi o wykrzyknik, to nie jest magia. Konwertuje wynik na true/false.

Twoim problemem może być to, że w anonimowej funkcji występuje błąd.

+4

Po prostu spróbuj ocenić "function (a) {alert (a); } (5); '- dostaniesz błąd. Następnie zamień 'function' na'! Function' i spróbuj ponownie. Zauważ też, że '(function (a) {...}) (5)' i '(function (a) {...} (5)) z powodzeniem działają. –

6

Drugi formularz function() {} to oświadczenie. Operator ! przekształca to w wyrażenie . Znajdziesz również przypadki, w których ludzie używają - lub + przed słowem kluczowym function.

Gdy masz wyrażenie oceniające dla funkcji, możesz wywołać tę funkcję za pomocą operatora ().

Innym (być może łatwiej zrozumieć) sposobem osiągnięcia zapisać sam efekt jest z innego zestawu nawiasie: znowu

(function(x) { body; })(arg); 

Poprzez umieszczenie funkcji wewnątrz nawiasu, konwertowanie go do wypowiedzi, która ocenia do funkcji. Ta funkcja jest wywoływana z argumentem arg.

0

to brzmi jak javascript składni błąd:

nazwany funkcja mogłaby być oświadczenie jednak anonimowa funkcja po prostu uważa to za wyrażenie.

Pro: można zrobić function() { ... }()

Con: nie można zrobić function() { ... }

Ale dlaczego ludzie chcą zdefiniować anonimową funkcję bez wywoływania go? Więc nie jest to problemem.

Powiązane problemy