funkcje

dość często musimy wykonać podobną akcję w wielu miejscach skryptu.

na przykład musimy pokazać ładną wiadomość, gdy odwiedzający loguje się, wylogowuje i może gdzieś indziej.

funkcje są głównymi „budulcami” programu. Pozwalają one na wielokrotne wywoływanie kodu bez powtórzeń.

widzieliśmy już przykłady wbudowanych funkcji, takich jakalert(message),prompt(message, default)Iconfirm(question). Ale możemy również tworzyć własne funkcje.,

deklaracja funkcji

aby utworzyć funkcję możemy użyć deklaracji funkcji.

wygląda to tak:

function showMessage() { alert( 'Hello everyone!' );}

functionnastępuje najpierw nazwa funkcji, a następnie Lista parametrów między nawiasami (oddzielona przecinkami, pusta w powyższym przykładzie) i wreszcie kod funkcji, zwany także „ciałem funkcji”, między nawiasami klamrowymi.,

function name(parameters) { ...body...}

nasza nowa funkcja może być wywołana po jej nazwie: showMessage().

na przykład:

function showMessage() { alert( 'Hello everyone!' );}showMessage();showMessage();

wywołanie showMessage() wykonuje kod funkcji. Tutaj zobaczymy wiadomość dwa razy.

Ten przykład wyraźnie pokazuje jeden z głównych celów funkcji: unikanie powielania kodu.,

Jeśli kiedykolwiek będziemy musieli zmienić wiadomość lub sposób jej wyświetlania, wystarczy zmodyfikować kod w jednym miejscu: funkcję, która go wyświetla.

zmienne lokalne

zmienna zadeklarowana wewnątrz funkcji jest widoczna tylko wewnątrz tej funkcji.

na przykład:

zewnętrzne zmienne

funkcja może również uzyskać dostęp do zewnętrznej zmiennej, na przykład:

let userName = 'John';function showMessage() { let message = 'Hello, ' + userName; alert(message);}showMessage(); // Hello, John

funkcja ma pełny dostęp do zewnętrznej zmiennej. Może go również modyfikować.,

na przykład:

zmienna zewnętrzna jest używana tylko wtedy, gdy nie ma lokalnej.

jeśli zmienna o tej samej nazwie jest zadeklarowana wewnątrz funkcji, to cieniuje ona zewnętrzną. Na przykład w kodzie poniżej funkcja używa lokalnego userName. Zewnętrzna jest ignorowana:

parametry

możemy przekazać dowolne dane do funkcji za pomocą parametrów (zwanych również argumentami funkcji) .

w poniższym przykładzie funkcja ma dwa parametry:from I text.,

Gdy funkcja jest wywoływana w liniach(*) I(**), podane wartości są kopiowane do zmiennych lokalnychfrom Itext. Następnie funkcja je wykorzystuje.

oto jeszcze jeden przykład: mamy zmienną from I przekazujemy ją do funkcji., Uwaga: funkcja zmienia from , ale zmiana nie jest widoczna na zewnątrz, ponieważ funkcja zawsze otrzymuje kopię wartości:

wartości domyślne

Jeśli parametr nie jest podany, to jego wartość staje sięundefined.

na przykład wspomniana funkcja showMessage(from, text) może być wywołana jednym argumentem:

showMessage("Ann");

To nie jest błąd. Takie wywołanie wywołałoby "*Ann*: undefined"., Nie ma text, więc przyjmuje się, że text === undefined.,

Jeśli chcemy użyć „domyślnego” text w tym przypadku możemy go określić po =:

function showMessage(from, text = "no text given") { alert( from + ": " + text );}showMessage("Ann"); // Ann: no text given

teraz, jeśli text parametr nie zostanie przekazany, otrzyma wartość "no text given"

tutaj "no text given"jest ciągiem znaków, ale może to być bardziej złożone wyrażenie, które jest obliczane i przypisywane tylko wtedy, gdy brakuje parametru., Tak więc jest to również możliwe:

alternatywne domyślne parametry

czasami warto ustawić domyślne wartości parametrów Nie w deklaracji funkcji, ale na późniejszym etapie, podczas jej wykonywania.,parametr, możemy porównać go z undefined:

function showMessage(text) { if (text === undefined) { text = 'empty message'; } alert(text);}showMessage(); // empty message

…lub możemy użyć ||Operator:

// if text parameter is omitted or "" is passed, set it to 'empty'function showMessage(text) { text = text || 'empty'; ...}

nowoczesne silniki JavaScript obsługują zerowy Operator koalescencyjny??, lepiej, gdy wartości falsy, takie jak0, są uważane za zwykłe:

zwracanie wartości

funkcja może zwrócić wartość z powrotem do kodu wywołującego jako wynik.,

najprostszym przykładem może być funkcja sumująca dwie wartości:

function sum(a, b) { return a + b;}let result = sum(1, 2);alert( result ); // 3

dyrektywa return może być w dowolnym miejscu funkcji. Gdy wykonanie zostanie wykonane, funkcja zatrzyma się, a wartość zostanie zwrócona do kodu wywołującego (przypisanego do result powyżej).

może występować wiele wystąpieńreturn w jednej funkcji. Na przykład:

można użyć return bez wartości., That causes the function to exit immediately.

For example:

function showMovie(age) { if ( !checkAge(age) ) { return; } alert( "Showing you the movie" ); // (*) // ...}

In the code above, if checkAge(age) returns false, then showMovie won’t proceed to the alert.,

return (some + long + expression + or + whatever * f(a) + f(b))

return; (some + long + expression + or + whatever * f(a) + f(b))

return ( some + long + expression + or + whatever * f(a) + f(b) )

nazwanie funkcji

funkcje są akcjami. Więc ich nazwa jest zwykle czasownikiem. Powinna być zwięzła, jak najdokładniejsza i opisywać to, co robi funkcja, tak aby ktoś czytający kod otrzymał wskazanie tego, co robi funkcja.,

powszechną praktyką jest uruchamianie funkcji z przedrostkiem słownym, który niejasno opisuje czynność. W zespole musi być porozumienie co do znaczenia prefiksów.

na przykład funkcje zaczynające się od "show" zazwyczaj coś pokazują.

funkcja zaczynająca się od…

przykłady takich nazw:

z przedrostkami w miejscu, rzut oka na nazwę funkcji daje zrozumienie, jaki rodzaj pracy wykonuje i jakiego rodzaju wartość zwraca.,

funkcje == Komentarze

funkcje powinny być krótkie i robić dokładnie jedną rzecz., Jeśli to coś jest duże, może warto podzielić funkcję na kilka mniejszych funkcji. Czasami przestrzeganie tej zasady może nie być takie łatwe, ale na pewno jest to dobra rzecz.

oddzielna funkcja jest nie tylko łatwiejsza do przetestowania i debugowania – jej istnienie jest świetnym komentarzem!

na przykład, Porównaj dwie funkcjeshowPrimes(n) poniżej. Każdy z nich wysyła liczby pierwsze do n.,

pierwszy wariant używa etykiety:

function showPrimes(n) { nextPrime: for (let i = 2; i < n; i++) { for (let j = 2; j < i; j++) { if (i % j == 0) continue nextPrime; } alert( i ); // a prime }}

drugi wariant używa dodatkowej funkcji isPrime(n) aby sprawdzić pierwotność:

drugi wariant jest łatwiejszy do zrozumienia, prawda? Zamiast fragmentu kodu widzimy nazwę akcji (isPrime). Czasami ludzie odnoszą się do takiego kodu jako samoopisanie.

tak więc funkcje mogą być tworzone nawet jeśli nie zamierzamy ich ponownie używać. Układają kod i czynią go czytelnym.,

podsumowanie

deklaracja funkcji wygląda następująco:

function name(parameters, delimited, by, comma) { /* code */}