Podstawy Programowania: Funkcje anonimowe

0:00Na koniec powiemy sobie jeszcze o funkcjach anonimowych.

0:03Jest to rzecz, która nie jest dostępna we

0:05wszystkich językach programowania ale w wielu jest.

0:08W niektórych nazywa się to closure. I jest to coś co jest bardzo przydatne

0:12szczególnie w języku JavaScript ale również np.

0:14w języku PHP takie funkcje są dostępne. I my z tych funkcji co ciekawe już w tym kursie

0:18skorzystaliśmy w przypadku sortowania tablicy.

0:21Będę chciał Ci to teraz przypomnieć. Utworzymy sobie tablicę, którą nazwę arr,

0:25chciałbym żeby ona tutaj miała kilka liczb 1, 55, 0 powiedzmy 15 i 33,

0:33będziemy je chcieli posortować.

0:34Być może pamiętasz, że na tablicach mamy takie metody,

0:38czyli są to nic innego jak funkcje wewnątrz takiego obiektu jak np.

0:43push.

0:44I teraz do takiej funkcji jak ją wywołujemy to możemy podać pewne parametry.

0:49W przypadku push mogliśmy dodawać coś do

0:52tablicy ale mieliśmy też metodę sort gdzie mogliśmy przekazać inną funkcję.

0:56Ja wtedy mówiłem, że jeżeli jeszcze nie

0:58rozumiesz koncepcji funkcji to będziesz musiał później tam wrócić.

1:01Teraz chce dokładniej wytłumaczyć co tutaj się dzieje.

1:03Otóż skoro do funkcji możemy przekazywać

1:06sobie dowolne parametry to możemy tam przekazać również inną funkcję.

1:11Zaraz będziesz dokładnie wiedział jak to

1:12działa ale przypomnę tylko, że my przekazaliśmy własną funkcję, która mogła

1:16przyjąć a i b i tu ją definiujemy, mogliśmy to nazwać jak chcieliśmy

1:20i teraz w przypadku sortowania tablicy jeżeli zwróciliśmy wartość ujemną to

1:24znaczy, że dwa elementy tablicy czyli tak jakby jeden, który wpadnie tutaj 55 będzie

1:29podstawione tu, że chcemy je zamienić kolejnością.

1:32Więc w skrócie, wtedy tego nie pokazałem

1:34ale w skrócie wystarczy, że z takiej funkcji zwrócimy

1:36a - b i teraz jeżeli zrobimy console.log(arr) to ta tablica będzie już posortowana

1:41od najmniejszej do największej liczby.

1:44Natomiast co tutaj się stało.

1:45Otóż my utworzyliśmy w tym miejscu funkcję

1:49i tutaj w środku jest ciało i tą funkcję przekazaliśmy do arr.sort.

1:52Nie wiemy jak pod spodem działa arr.sort

1:55bo to już jest wbudowane w języku JavaScript,

1:57ale to nasza funkcja właśnie tam się znalazła i my możemy w tej funkcji

2:00zdecydować jak chcemy sortować te elementy.

2:03Co ważne gdybyśmy tę funkcję wycięli i przypisali ją do jakiejś stałej np.

2:09powiedzmy nazwalibyśmy ją sort

2:12to moglibyśmy tutaj przekazać sort. Cały

2:14czas o tym pamiętaj, że wszędzie tam gdzie możesz wstawić jakąś wartość możesz też

2:18podać odwołanie do zmiennej czy stałej, która przechowuje tę wartość.

2:21Tutaj nawet byśmy jeszcze mogli zrobić inaczej.

2:24Moglibyśmy funkcję nazwać sort

2:26i dokładnie tak samo ją przekazać.

2:28Efekt byłby identyczny. Natomiast w tej lekcji mówimy o funkcjach anonimowych i

2:32anonimowa jest wtedy kiedy właśnie ją podajemy w ten sposób, że nie przypisywaliśmy

2:35jej żadnej nazwy itd tylko ją tutaj po prostu wstawiliśmy.

2:40Teraz Ci pokaże drugi przykład, gdzie my wykorzystamy funkcję przekazaną przez

2:44kogoś bo tutaj my przekazujemy funkcje do metody sort,

2:47nie wiemy co się z tą funkcją dzieje pod spodem.

2:49Wiemy tylko, że na jakimś etapie ona

2:51otrzymuje pod parametry, które tutaj zadaliśmy poszczególne elementy tablicy. Natomiast

2:57teraz będę chciał utworzyć swoją własną funkcję i pokazać Ci jak to może wyglądać.

3:01Więc tworzymy sobie funkcję sayHello,

3:04może zrobię tutaj trochę miejsca

3:07i będę chciał żeby ta funkcja wyświetlała nam jakiś tekst.

3:09Czyli chciałbym żeby ona przyjmowała

3:11parametr tekst i żeby robiło console.log np.

3:16albo może nawet nie console.log

3:19tylko chciałbym żeby ta funkcja zwracała.

3:22Na razie zrobimy tylko ten tekst.

3:24Więc jeżeli teraz zrobimy sobie rezultat i

3:27wysyłamy funkcję sayHello i podamy tutaj cześć,

3:31no to to cześć można powiedzieć wpadnie pod ten parametr tekst i go zwrócimy.

3:37Czyli ta funkcja tak naprawdę do res

3:39zwróci nam cześć. I teraz zrobimy console.log(res), zobaczymy po prostu cześć.

3:44Na razie to nie ma wiele sensu ale teraz pokażę Ci co możemy z tym zrobić.

3:47Możemy powiedzieć, że nasza funkcja, którą

3:49właśnie tworzymy przyjmuje jeszcze drugi parametr taki jak getName.

3:54To jest nazwa cały czas dowolna.

3:56Ty to nazywasz tak jak chcesz bo są to

3:59tak jakby zmienne lokalne. I teraz chcemy tutaj przekazywać funkcje.

4:03Bo gdybym po prostu tutaj przekazywał name np.

4:07byśmy to nazwali name i tutaj byśmy dodawali ten tekst

4:12czyli cześć przekazane, potem spację i do tego byśmy dokleili name

4:17to w momencie wywołania naszej funkcji sayHello moglibyśmy powiedzieć cześć,

4:22jako drugi parametr podać Piotr z wykrzyknikiem np.

4:27i zauważ, że nasza funkcja zwróci wtedy cześć Piotr.

4:30Tutaj moglibyśmy podać tak dokładnie i zwróci cześć Piotr.

4:34Dlaczego?

4:35Bo cześć pierwszy parametr wpadnie pod tekst Piotr wpadnie pod name,

4:39no i ta funkcja zwróci tekst czyli cześć

4:42połączy to ze spacją i połączy to z Piotr.

4:44Ale skoro mówimy o funkcjach anonimowych

4:46to pokażę Ci, że możemy to name zamienić na getName.

4:49Oczywiście mogę tego nie zamieniać to

4:51dowolna nazwa ale getName będzie nam sugerowało, że to pozwala jakoś pobrać imię

4:56i będziemy chcieli tutaj wywołać sobie to getName.

4:59Dziwnie wygląda, na razie jeszcze nie działa ale już Ci powiem jak to naprawić.

5:04Możemy tutaj do tej funkcji sayHello

5:06przekazać co chcemy jak przekaże dwójkę pod getName będzie dwójka więc jak

5:10przekaże funkcję, którą właśnie tworzę w tym miejscu i zwrócę z tej funkcji Piotr,

5:20to zobacz co tutaj się dzieje.

5:21Cała ta funkcja anonimowa została

5:24utworzona w tym miejscu i przekazana przy wywołaniu funkcji sayHello pod getName.

5:30No bo pierwszy parametr to jest tekst,

5:32przekazaliśmy część po przecinku przekazujemy drugi parametr czyli getName.

5:35To oznacza, że wewnątrz tej funkcji pod

5:38getName mamy dokładnie odwołanie do tej funkcji.

5:41A skoro pod getName jest funkcja to funkcję można wywołać parą nawiasów okrągłych.

5:46I teraz to co ta funkcja zwróci,

5:48a więc return Piotr jest tutaj podstawione przy wywołaniu.

5:51Ja wiem, że to się może wydać skomplikowane ale w bardzo wielu miejscach szczególnie w

5:55JavaScript podajemy takie funkcje anonimowe dokładnie tak jak to zrobiliśmy tutaj.

6:00Podaliśmy funkcję, która gdzieś pod spodem została wywołana nie wiemy jak,

6:03natomiast tutaj wiemy, bo to my utworzyliśmy funkcję sayHello, która jako

6:07drugi parametr przyjmuje funkcję, która ma zwrócić imię. To jest taki prosty przykład

6:12natomiast tu by można było podać funkcję, która np.

6:15zapyta o imię użytkownika i dopiero wtedy to zwróci.

6:18Niemniej jednak ważne jest to, że funkcje można przekazać jako parametr tak samo jak

6:22można przekazać tablicę, ciąg znaków czy np.

6:25liczbę.

6:25I jeśli ją tutaj przekażemy to pod getName jest dokładnie ta funkcja.

6:29Zatem ją wywołujemy i to co ona zwraca jest tutaj podstawiane,

6:33a więc Piotr jest łączone z tekst, które

6:36przekazaliśmy no i dzięki temu zobaczymy tutaj cześć

6:39Piotr.

6:40Oczywiście tutaj można by było tą funkcję stąd wyciąć,

6:44nazwać sobie gdziekolwiek funkcję,

6:48tutaj można byłoby ją utworzyć, nazwać ją getName,

6:50chociaż te nazwy nie mają nic wspólnego ze sobą to jest inny zakres,

6:54można by ją było nazwać np.

6:57zwróć

6:59imię i tą funkcję można by było tutaj wtedy przekazać.

7:04Tylko jej nie wywoływać bo jeśli byśmy ją

7:06wywołali to byśmy podstawili w tym miejscu to co wpadnie pod getName, to co ta funkcja zwraca.

7:13Więc to by było tak samo jak byśmy tutaj wpisali Piotr.

7:17Natomiast jeśli przekażemy tylko do niej referencje tak,

7:21to cały czas to będzie działać poprawnie bo utworzyłem funkcję, która zwraca Piotr

7:25do funkcji sayHello

7:26ją przekazałem a więc ona wpada pod getName i dopiero tu jest wywołana.

7:30Wiem, że to może być skomplikowane ale

7:32chciałem Ci pokazać, że tak funkcje przekazywać też można ale, że ta lekcja

7:36skupia się na funkcjach anonimowych to chciałbym to zostawić w takiej formie.

7:39A więc tworzę tutaj jakby w locie funkcję bez żadnej

7:42nazwy, ona jest tylko jednorazowo potrzebna więc ją utworzyłem, wpadnie ona pod getName,

7:47zostanie w odpowiednim momencie wywołana i dzięki temu będzie tutaj cześć Piotr,

7:51a jeśli tutaj coś zmodyfikujemy również to zobaczymy na ekranie.