Članak u razvoju!

Članak u kojem ćemo razmotriti što je funkcija, kao i tradicionalnu (klasičnu) verziju rada s njom. Dodatno ćemo analizirati koji su argumenti (parametri) funkcije i operatora return.

Što je funkcija?

Funkcija je skup instrukcija kojima se može dati ime i zatim im se može pristupiti pod tim imenom s bilo kojeg mjesta u programu.

Klasičan primjer korištenja funkcije.

Na web stranici postoji JavaScript kod čiji se dio ponavlja nekoliko puta. Da biste to izbjegli, možete oblikovati ovaj fragment kao funkciju, a zatim ga pozvati na potrebnim mjestima u kodu koristeći naziv ove funkcije. Pozivanje ove funkcije značit će izvršavanje instrukcija sadržanih u njoj.

• Kako organizirati izvršavanje nekog zadatka u JavaScriptu pomoću funkcija? Da biste to učinili, obično učinite sljedeće:
• rastaviti zadatak na sastavne dijelove (podzadatke);
• podzadaci su formalizirani kroz funkcije;

razviti glavni kod koristeći pozive stvorenih funkcija.

Kao rezultat toga, takav program postaje strukturiraniji. Lakše je napraviti razne promjene i dodati nove značajke.

Deklaracija i pozivanje funkcije

• Operacije s funkcijom u JavaScriptu mogu se podijeliti u 2 koraka:
• deklaracija (kreacija) funkcije.

pozvati (izvršiti) ovu funkciju. Deklaracija funkcije. Stvaranje funkcije u JavaScriptu počinje pisanjem

ključna riječ

funkcija , zatim se navodi naziv funkcije, zatim se po potrebi u zagradama x navode parametri, zatim se navode upute koje se nalaze u vitičastim zagradama.

// deklaracija funkcije someName function someName() ( alert("Pozvali ste funkciju someName!"); ) JavaScript - Sintaksa deklaracije funkcije

Funkcija može imati onoliko parametara koliko želite ili niti jedan. Zagrade su uključene u svakom slučaju. Ako postoji više parametara, oni moraju biti odvojeni zarezom. Funkcijskim parametrima se pristupa njihovim imenom.

Skup instrukcija u vitičastim zagradama je kod funkcije koji će se izvršiti kada se pozove.

Poziv funkcije.

Sama deklarirana funkcija neće biti izvršena. Da biste ga pokrenuli, morate ga pozvati. Funkcija se poziva navođenjem njenog imena i dvije zagrade. Argumenti se navode unutar zagrada ako je potrebno.

// pozivamo funkciju danu u prethodnom primjeru someName();

JavaScript - Sintaksa poziva funkcije Je li funkcija objekt u JavaScriptu? Funkcije u JavaScriptu su objekti.

U JavaScriptu sve je objekt osim šest

primitivni tipovi

podaci. A ako je funkcija objekt, tada se referenca na nju može pohraniti u varijablu.

// deklaracija funkcije someName function someName() ( alert("Pozvali ste funkciju someName!"); ) var reference = someName;

Nakon toga, funkciju možete pozvati ovako:

Referenca();

Parametri i argumenti funkcije

Argumenti funkcije su vrijednosti koje se prosljeđuju funkciji kada se ona pozove. Argumenti su međusobno odvojeni zarezom.

// pozivamo funkciju sayWelcome prosljeđujući joj dva argumenta sayWelcome("Ivan", "Ivanov"); // još jedan poziv sayWelcome funkcije s dva argumenta sayWelcome("Petar", "Petrov");

Parametri funkcije jedan su od načina u JavaScriptu na koji možete pristupiti argumentima unutar funkcije. U zagradama su opisani parametri funkcije u fazi njene deklaracije.

Na primjer, pozovimo funkciju iz gornjeg primjera, bez navođenja jednog ili dva parametra:

// pozivanje funkcije sayWelcome i prosljeđivanje jednog argumenta njoj sayWelcome("Peter"); // Dobro došao, nedefinirano Peter // pozivanje funkcije sayWelcome bez prosljeđivanja argumenata sayWelcome(); // Dobro došli, undefined undefined

Primjer funkcije koja će jednostavno ispisati argumente koji su joj proslijeđeni na konzolu preglednika:

// deklaracija funkcije function outputParam(param1, param2, param3) ( console.log(param1 + "; " + param2 + "; " + param3); ) // poziva funkciju outputParam prosljeđujući je različite količine parametri outputParam("Kiša","Snijeg","Magla"); // Kiša; Snijeg; Izlaz magle Param(17); // 17; nedefinirano; nedefinirani outputParam(24,33); // 24; 33; nedefinirani outputParam(); // nedefinirano; nedefinirano; nedefinirano

Drugi način pristupa argumentima unutar funkcije je korištenje posebnog objekta argumenata. Pristup argumentima preko argumenata je isti kao pristup elementima regularni niz, tj. njihovim serijskim brojevima. Dakle, argument - će vam omogućiti da dobijete prvi argument, argumenti - drugi argument, itd.

// deklaracija funkcije sum function sum(num1, num2) ( /* num1 ili argumenti – dobivanje vrijednosti argumenta 1 num2 ili argumenti – dobivanje vrijednosti argumenta 2 */ var sum1 = num1 + num2, sum2 = argumenti + argumenti; return "Zbroj, dobiven 1. metodom jednak je " + zbroj1 + "; zbroj dobiven 2. metodom je " + zbroj2;) /* ispis rezultata funkcije zbroja na konzolu 7 - prvi argument (it može mu se pristupiti ili imenom num1 ili korištenjem argumenata) 4 - drugi argument (može mu se pristupiti ili imenom num2 ili korištenjem argumenata) */ console.log(sum(7,4));

Glavna razlika između ovih metoda je u tome što prva od njih omogućuje pristup samo onim argumentima koji su dobili imena u fazi deklaracije funkcije. Druga metoda vam omogućuje da dobijete vrijednost bilo kojeg argumenta, čak i ako nema naziv (by serijski broj). Ovo je prilika JavaScript jezik omogućuje stvaranje univerzalnih fleksibilnih funkcija.

Uz primanje argumenata, objekt argumenata također vam omogućuje da znate njihov broj. To se radi pomoću svojstva duljine.

Možete ponavljati argumente proslijeđene funkciji, na primjer, pomoću za petlju ili za...od .

// deklaracija funkcije sum function sum() ( var i = 0; console.log("Izlaz svih argumenata pomoću for petlje"); for (i; i< arguments.length; i++) { console.log(i + 1 + " аргумент равен " + arguments[i]); } console.log("Вывод всех аргументов с помощью цикла for...of"); for (arg of arguments) { console.log(arg); } } // вызов функции sum sum(7, 4, 3, 1);

Funkcija koja na konzoli prikazuje sve argumente koji su joj proslijeđeni i njihov broj:

// deklaracija funkcije function myFunction () ( var i; console.log("Broj proslijeđenih parametara = " + arguments.length); // prođimo kroz sve parametre koristeći for petlju for (i = 0; i< arguments.length; i++) { console.log(i + " параметр = " + arguments[i]); } } // вызовы функции myFunction myFunction(3, 7, 27, "JavaScript"); myFunction(); myFunction("Яблоки", "Груши", "Апельсины");

Funkcija koja vrši zbrajanje svih argumenata koji su joj proslijeđeni (njihov broj je unaprijed nepoznat):

// deklaracija funkcije var myCalc = function() ( // prođimo kroz sve parametre koristeći for petlju var i, sum = 0; for (i = 0; i lt; arguments.length; i++) ( sum += argumenti [i] ) // vraćanje zbroja rezultata; // poziv funkcije na konzoli.

Kao rezultat toga, pomoću objekta argumenata možete implementirati sljedeće u tijelu funkcije:

• provjera broja prošlih argumenata;
• obrada bilo kojeg broja parametara.

Osim same funkcije, druge funkcije koje se u njoj nalaze također imaju pristup argumentima koji joj se prosljeđuju u fazi poziva.

Funkcija mainF(p1, p2) ( funkcija childF() ( console.log("p1 = " + p1 + "; p2 = " + p2); ) childF(); ) mainF(3, 5); // p1 = 3; p2 = 5 glavni F(4, 7); // p1 = 4; p2 = 7

Zadane postavke

Počevši od ECMAScripta 2015 (6), parametar funkcije može se postaviti na zadanu vrijednost.

Na primjer, postavimo parametar "color" na njegovu zadanu vrijednost, jednaku "#009688":

Funkcija setBGColor(color = "#009688") (document.body.style.backgroundColor = boja; ) setBGColor(); // boja pozadine će biti #009688 setBGColor("red"); // boja pozadine će biti crvena

Prije ECMAScripta 2015, mogli ste postaviti parametar na njegovu zadanu vrijednost, na primjer, ovako:

Funkcija setBGColor(boja) ( boja = boja !== nedefinirano ? boja: "#009688"; // postavljanje boje na zadanu vrijednost "#009688" document.body.style.backgroundColor = boja; )

Preostali parametri

Ako joj prilikom pozivanja funkcije proslijedite više argumenata nego što ima parametara, tada možete dobiti preostale koristeći takozvane rest patametre. Ova prilika pojavio se u jeziku počevši od ECMAScript 2015.

// ...nums - preostali parametri, kojima se u ovom slučaju može pristupiti imenom nums function doMath(mathAction, ...nums) ( var result = 0; nums.forEach(function(value) ( ​​​​switch ( mathAction) ( case "sum": result += value; break; result = 0; ) return result; ) console.log(doMath("sum", 3, 4, 21, -4)); // 24 (3 + 4 + 21 + (-4)) console.log(doMath("sumSquare", 1, 4)); // 17 (1^2 + 4^2) console.log(doMath("sumCube", 3, 2, 4)); // 99 (3^3 + 2^3 + 4^3)

povratna izjava

Naredba return namijenjena je vraćanju vrijednosti ili rezultata vrednovanja izraza trenutna funkcija. Vrijednost ili izraz moraju biti odvojeni razmakom od povratne vrijednosti. Osim toga, naredba return zaustavlja izvršavanje funkcije, tj. sve upute koje slijede neće biti izvršene.

Funkcija u JavaScriptu uvijek vraća rezultat, bez obzira koristi li se izjava return ili ne.

// funkcija koja vraća rezultat function sayWelcome (userFirstName, userLastName) ( if ((!userFirstName) || (!userLastName)) return "Dobrodošli, anonimni korisnik"; else return "Dobrodošli, " + userLastName + " " + userFirstName; ) // deklarirajte varijablu person var person; // dodijelite rezultat funkcije sayWelcome varijabli person person = sayWelcome("Ivan","Ivanov" ); // ispis vrijednosti varijable na konzoli console.log(person); //Instrukcija koja će prikazati rezultat funkcije na konzoli sayWelcome console.log(sayWelcome("Petr","Petrov")) ; //Uputa koja će prikazati rezultat funkcije na konzoli sayWelcome console.log(sayWelcome("Sidorov")); JavaScript - Funkcija s provjerom parametara

Funkcija u JavaScriptu uvijek vraća rezultat kao rezultat svojeg izvršenja, čak i ako nije eksplicitno definirana pomoću naredbe return. Ovaj rezultat je nedefiniran.

// 1. funkcija koja ne vraća nikakav rezultat function sayWelcome (userFirstName, userLastName) ( console.log("Welcome, " + userLastName + " " + userFirstName); ) // pokušajmo dobiti rezultat od funkcije koja radi ne vraća ništa konzola .log(sayWelcome("Ivan", "Ivanov")); // 2. funkcija koja sadrži naredbu return bez vrijednosti function sayDay (dan) ( dan = "Danas," + dan; return; //ova se instrukcija neće izvršiti jer dolazi nakon naredbe return console.log(dan) ; ) // pokušajmo dobiti rezultat iz funkcije koja sadrži naredbu return bez vrijednosti console.log(sayDay("21. veljače 2016."));

JavaScript - Dohvaćanje vrijednosti iz funkcije koja ne vraća ništa

Isti će se rezultat dobiti ako naredba return ne specificira povratnu vrijednost.

Preopterećenje funkcija u JavaScriptu

Preopterećenje funkcija u programiranju je mogućnost deklariranja nekoliko funkcija s istim imenima u istom opsegu. Takve se funkcije međusobno razlikuju po vrsti i broju argumenata. Svaka funkcija ima svoju programsku logiku. Preopterećenje funkcija koristi se tako da se slične radnje mogu izvesti korištenjem jednog naziva funkcije.

Jezik JavaScript ne podržava preopterećenje funkcija na isti način kao što je to implementirano, na primjer, u jezicima sličnim C-u. one. U JavaScriptu ne možete stvoriti više funkcija s istim nazivima koje su u istom opsegu.

• Slična funkcionalnost može se implementirati u JavaScript pomoću sljedećih koraka:
• Da biste provjerili je li argument proslijeđen ili ne, koristite uvjet koji provjerava njegovu vrijednost za nedefinirano.
• Za provjeru broja argumenata proslijeđenih funkciji, koristite svojstvo duljine argumenata objekta.
• Da biste saznali vrstu proslijeđene vrijednosti argumenta, koristite operatore typeof ili instanceof. Za rad varijabilni broj
• argumenti, upotrijebite objekt argumenata.

Počevši od ECMAScript6, možete odrediti zadane vrijednosti za argumente.

Na primjer, stvorimo funkciju koja se može pozvati s jednim ili dva argumenta: //deklaracija funkcije koja mijenja boju elementi funkcija setBgColor(bgColor,elements) ( //ako parametar elemenata nije naveden prilikom poziva if (elements=== nedefinirano) ( //zatim postavite njegovu vrijednost na "div" elements = "div"; ) //dobijte sve elements elements = $(elements); // iteracija kroz sve elemente i postavljanje na navedene elemente boje pozadine.each(function())( $(this).css("background-color",bgColor); )) / *Pozovite funkciju setBgColor, navodeći jedan parametar. Jer 2 parametar nije naveden, tada će ova funkcija promijeniti boju pozadine svih div elemenata.*/ setBgColor("green"); /*Pozovite funkciju setBgColor, navodeći 2 parametra. Jer Zatim je naveden 2 parametar

ovu funkciju

promijenit će boju pozadine samo elemenata gumba.*/ setBgColor("#ff0000","button");

Napravimo neke promjene u gornjem kodu. Naime, zadajemo zadanu vrijednost za drugi parametar:

//deklaracija funkcije koja mijenja boju pozadine elemenata //parametar elemenata ima vrijednost "div" prema zadanoj funkciji setBgColor(bgColor,elements = "div") ( //dobi sve elemente elemente = $(elements); //iterirajte sve elemente i postavite ih na navedene elemente boje pozadine.each(function())( $(this).css("background-color",bgColor); ) ) //pozovite funkciju setBgColor, navodeći jedan parametar setBgColor("zelena"); //pozovite funkciju setBgColor, navodeći 2 parametra setBgColor("#ff0000","button");

Primjer kako u JavaScriptu možete implementirati "preopterećenu" funkciju koja izračunava broj kalorija koje osoba treba dnevno:

// opis funkcije function countCal(sex, height) ( // parametri: sex (spol) i height (height) var result; if ((sex === 0) || (sex === "man") ) ( rezultat = (visina - 100) * 20; ) inače ako ((spol === 1) || (spol === "žena")) ( rezultat = (visina - 105) * 19; ) ako (rezultat ) ( // argumenti - razina aktivnosti if (argumenti) ( rezultat *= argumenti; ) console.log("Količina kcal za normalan život: " + rezultat) else ( console.log("Netočni parametri"); ) ) / * pozivanje funkcije i prosljeđivanje 2 argumenta u nju (1 - "čovjek", može mu se pristupiti pomoću imena spol i argumenata; 2 - vrijednost 185, može joj se pristupiti pomoću imena spol i argumenata) */ countCal(" čovjek", 185); /* pozivanje funkcije i prosljeđivanje 3 parametra u nju, iako su samo 2 prisutna u opisu funkcije (u ovom slučaju, možete dobiti vrijednost 3. parametra samo kao argumente) */ countCal(0, 185, 2);

Funkcija se obično poziva ovisno o tome kako je deklarirana imenom ili varijablom koja sadrži referencu na funkciju.

Funkcija fact(n) ( if (n === 1) ( return 1; ) return fact(n-1) * n; ) console.log(fact(5)); // 120

Funkciju unutar njenog tijela možete pozvati ne samo imenom, već i korištenjem svojstva callee objekta argumenata. Ali ovo svojstvo Bolje je ne koristiti, jer... zastario je. Osim toga, u strogom načinu rada uopće ne radi.

Što su ugrađene (standardne) funkcije?

JavaScript ima veliki skup ugrađenih (standardnih) funkcija. Ove funkcije su već opisane u samom pretraživaču. Gotovo sve su metode jednog ili drugog objekta.

Na primjer, da bi se pozvalo upozorenje ugrađene funkcije (metode), ne mora se prvo deklarirati. Već je opisano u pregledniku. Poziv metoda uzbunjivanja radi se navođenjem imena, zagrada i argumenta unutar njih. Ova je metoda dizajnirana za prikaz poruke na zaslonu u obliku dijaloškog okvira. SMS poruka uzima se iz vrijednosti parametra ove funkcije.

// pozivanje funkcije upozorenja alert("Neki tekst");

JavaScript - Pozivanje funkcije upozorenja

• 24. svibnja 2011. u 01:13 Pet načina za pozivanje funkcije

• JavaScript

Prijevod Često naiđem na JavaScript kod u kojem su pogreške uzrokovane nerazumijevanjem načina na koji funkcije funkcioniraju u JavaScriptu (usput, veći dio ovog koda napisao sam ja). JavaScript je jezik s više paradigmi i ima mehanizme funkcionalno programiranje

. Vrijeme je da istražite te mogućnosti. U ovom ću vam članku reći pet načina za pozivanje funkcija u JavaScriptu. U prvim fazama učenje JavaScripta Početnici obično misle da njegove funkcije rade na isti način kao, recimo, C#. Ali mehanizama za pozivanje funkcija u JavaScriptu ima nekoliko važne razlike

, a njihovo nepoznavanje može rezultirati pogreškama koje neće biti lako pronaći. Hajdemo pisati jednostavna funkcija
, koji vraća niz od tri elementa - trenutnu this vrijednost i dva argumenta proslijeđena funkciji.

funkcija makeArray(arg1, arg2)( return [ this, arg1, arg2 ]; )
Najčešći način: globalni poziv Početnici često deklariraju funkcije kao što je prikazano u gornjem primjeru. Pozivanje ove funkcije je jednostavno:
makeArray("jedan", "dva"); // => [ prozor, "jedan", "dva" ]

U JavaScriptu, bez obzira izvršava li se skripta u pregledniku ili u drugom okruženju, ona je uvijek definirana globalni objekt. Svaki kod u našoj skripti koji nije "vezan" ni na što (to jest, izvan deklaracije objekta) zapravo je u kontekstu globalnog objekta. U našem slučaju makeArray nije samo funkcija koja "šeta" sama po sebi. Zapravo, makeArray je metoda globalnog objekta (u slučaju izvršavanja koda u pregledniku) window. Lako je dokazati:
upozorenje(tip prozora.metodaKojaPostoji); // => nedefinirano upozorenje(typeof window.makeArray); // => funkcija
To jest, pozivanje makeArray("one", "two"); je ekvivalentan pozivu window.makeArray("one", "two"); .

Žalosti me što je ovo najčešći način pozivanja funkcija, jer implicira prisutnost globalne funkcije. A svi znamo da globalne funkcije i varijable nisu najbolji oblik u programiranju. To posebno vrijedi za JavaScript. Izbjegavajte globalne definicije i nećete požaliti.

Pravilo za pozivanje funkcije #1: Ako se funkcija poziva izravno, bez navođenja objekta (na primjer, myFunction()), vrijednost ovoga bit će globalni objekt (prozor ako se kôd izvodi u pregledniku).

Pozivanje metode Kreirajmo jednostavan objekt i načinimo makeArray njegovom metodom. Deklarirajmo objekt koristeći literalnu notaciju, a zatim pozovimo našu metodu:
// kreiraj objekt var arrayMaker = ( someProperty: "neka vrijednost", make: makeArray); // poziv make() metode arrayMaker.make("one", "two"); // => [ arrayMaker, "jedan", "dva" ] // alternativna sintaksa, koristite uglate zagrade arrayMaker["make"]("one", "two"); // => [ arrayMaker, "jedan", "dva" ]
Vidite li razliku? Vrijednost toga u ovom slučaju je sam objekt. Zašto ne window , kao u prethodnom slučaju, budući da se deklaracija funkcije nije promijenila? Tajna je u tome kako se funkcije prosljeđuju u JavaScriptu. Funkcija je standardna Vrsta JavaScripta, koji je zapravo objekt, a kao i svaki drugi objekt, funkcije se mogu prosljeđivati ​​i kopirati. U ovom slučaju, u biti smo kopirali cijelu funkciju, uključujući popis argumenata i tijelo, i dodijelili rezultirajući objekt svojstvu make objekta arrayMaker. Ovo je ekvivalentno deklaraciji poput ove:
var arrayMaker = ( someProperty: "Neka vrijednost"; make: funkcija (arg1, arg2) ( return [ this, arg1, arg2]; ) );
Pravilo pozivanja funkcije #2: U funkciji koja se poziva pomoću sintakse poziva metode, kao što je obj.myFunction() ili obj["myFunction"](), ovo će imati vrijednost obj.

Nerazumijevanje ovog općenito jednostavnog principa često dovodi do pogrešaka prilikom obrade događaja:
function buttonClicked())( var text = (this === window) ? "window" : this.id; alert(text); ) var button1 = document.getElementById("btn1"); var button2 = document.getElementById("btn2"); button1.onclick = buttonClicked; button2.onclick = function())( buttonClicked(); );
Klikom na prvi gumb prikazat će se poruka "btn1" jer u ovom slučaju pozivamo funkciju kao metodu, a ova unutar funkcije će dobiti vrijednost objekta kojem ta metoda pripada. Klikom na drugi gumb dobit ćete "prozor" jer u ovom slučaju izravno pozivamo buttonClicked (tj. ne kao obj.buttonClicked()). Ista stvar se događa kada oznaci elementa dodijelimo rukovatelj događajima, kao u slučaju trećeg gumba. Klikom na treći gumb prikazat će se ista poruka kao i drugi.

Kada koristite biblioteke kao što je jQuery, ne morate razmišljati o tome. jQuery će se pobrinuti da prepiše ovu vrijednost u rukovatelju događajima tako da je ova vrijednost element koji je pokrenuo događaj:
// koristi jQuery $("#btn1").click(function() ( alert(this.id); // jQuery će se pobrinuti da je "ovo" gumb ));
Kako jQuery uspijeva promijeniti vrijednost ovoga? Pročitajte u nastavku.

Još dva načina: apply() i call() Logično je da što češće koristite funkcije, to ih češće morate prosljeđivati ​​i pozivati ​​u različitim kontekstima. Često postoji potreba za nadjačavanjem vrijednosti ovoga. Ako se sjećate, funkcije u JavaScriptu su objekti. U praksi to znači da funkcije imaju unaprijed definirane metode. apply() i call() su dva od njih. Omogućuju vam da nadjačate ovu vrijednost:
var car = ( godina: 2008, model: "Dodge Bailout" ); makeArray.apply(car, [ "jedan", "dva" ]); // => [ auto, "jedan", "dva" ] makeArray.call(auto, "jedan", "dva"); // => [ auto, "jedan", "dva" ]
Ove dvije metode su vrlo slične. Prvi parametar nadjačava ovo. Razlike između njih su u sljedećim argumentima: Function.apply() prihvaća niz vrijednosti koje će biti proslijeđene funkciji, dok Function.call() prihvaća argumente zasebno. U praksi je, po mom mišljenju, praktičnije koristiti apply() .

Pravilo pozivanja funkcije #3: Ako želite nadjačati vrijednost this bez kopiranja funkcije u drugi objekt, možete koristiti myFunction.apply(obj) ili myFunction.call(obj) .

Konstruktori Neću ulaziti u detalje o deklariranju prilagođenih tipova u JavaScriptu, ali mislim da je važno podsjetiti vas da u JavaScriptu nema klasa, a svaki prilagođeni tip treba konstruktor. Osim toga, metode prilagođeni tip Bolje ga je deklarirati pomoću prototipa, što je svojstvo funkcije konstruktora. Kreirajmo vlastiti tip:
// deklariramo funkciju konstruktora ArrayMaker(arg1, arg2) ( this.someProperty = "bez obzira"; this.theArray = [ this, arg1, arg2 ]; ) // deklariramo metode ArrayMaker.prototype = ( someMethod: function () ( alert( "Pozvano nekom metodom"); getArray: function () ( return this.theArray; ) ); var am = new ArrayMaker("jedan", "dva"); var other = new ArrayMaker("prvi", "drugi"); am.getArray(); // => [am, "jedan", "dva" ]
Važna stvar u ovom primjeru je prisutnost novog operatora prije poziva funkcije. Da nije toga, bio bi to globalni poziv, a svojstva stvorena u konstruktoru pripadala bi globalnom objektu. Ne treba nam to. Osim toga, konstruktori obično ne vraćaju vrijednosti eksplicitno. Bez novog operatora konstruktor bi vratio nedefinirano, s njim vraća ovo. Dobar stil dolaze u obzir imena konstruktora veliko slovo; Ovo će vas podsjetiti na potrebu za novim operaterom.

Inače će kod unutar konstruktora vjerojatno biti sličan kodu koji biste napisali na drugom jeziku. Vrijednost ovoga u ovom slučaju je novi objekt koji stvarate.

Pravilo pozivanja funkcije br. 4: Prilikom pozivanja funkcije sa operater nov, vrijednost ovoga bit će novi objekt koji je izradilo vrijeme izvođenja JavaScripta. Ako ova funkcija eksplicitno ne vrati nijedan objekt, on će biti vraćen implicitno.

Zaključak Nadamo se da razumijemo razliku između na različite načine pozivi funkcija omogućit će vam da poboljšate svoj JavaScript kod. Ponekad je pogreške povezane s ovom vrijednošću teško uhvatiti, pa ih ima smisla spriječiti unaprijed.

Funkcije JavaScripta omogućuju organiziranje i pojednostavljenje skripti ponovno koristiti kodirati. Umjesto stvaranja dugačkih dijelova koda razbacanih po HTML stranici, skripte su organizirane u logičke grupe.

Deklariranje i pozivanje JavaScript funkcije

Sintaksa JavaScript funkcije je sljedeća:

funkcija ""ime"" (""argument1"", ""argument2"", ""argument3"" ...) ( ""operatori"" return ""vrijednost"" )

Ime određuje kako ćemo zvati funkciju kada je pozovemo. Argumenti određuju vrijednosti koje se prosljeđuju funkciji za obradu. Odjeljak s izjavama predstavlja tijelo funkcije koja obavlja obradu. Neobavezna izjava return omogućuje vam vraćanje vrijednosti.

Sljedeći primjer prikazuje funkciju definiranu u odjeljku HTML stranice i pozvanu u odjeljku:

funkcija sayHello() ( alert("Zdravo!"); ) sayHello();

Prijenos argumenata funkciji

U gornjem primjeru (funkcija JavaScript vrste teksta skripte), funkciji se ne prosljeđuju argumenti. Obično je funkcija dizajnirana za izvođenje neke radnje s nekoliko argumenata:

Jednostavan primjer funkcije JavaScript funkcije sayHello(dan, mjesec) ( alert("Zdravo! Danas je " + dan + " " + mjesec); ) sayHello("24", "srpanj"); sayHello("1", "kolovoz"); sayHello("24", "svibanj");

U ovom primjeru, JavaScript funkcija povratnog poziva poziva se više puta, uzimajući argumente koji se zatim koriste za stvaranje niza koji se prikazuje u dijaloškom okviru. Da biste to učinili bez funkcije, morali biste ponoviti skriptu u odjeljku tri puta. Očito je korištenje funkcije učinkovitiji pristup.

Vraćanje vrijednosti iz funkcije

Naredba return koristi se za vraćanje vrijednosti iz funkcije i njezino korištenje na mjestu gdje je funkcija pozvana. Kao primjer, deklarirat ćemo funkciju koja dodaje dva argumenta i vraća rezultat:

Primjer jednostavne JavaScript funkcije var result = addValues(10, 20) document.write("Rezultat = " + rezultat);

U gornjem primjeru prosljeđujemo vrijednosti 10 i 20 funkciji addValues. Funkcija addValues ​​​​zbraja ove dvije vrijednosti i vraća rezultat. Naredba return dodjeljuje rezultat varijabli rezultata, koja se zatim koristi za stvaranje niza koji se ispisuje na HTML stranici.

Poziv JavaScript funkcije može se izvršiti u različita mjesta. Na primjer, nije potrebno dodijeliti rezultat kao vrijednost varijable. Možete ga koristiti izravno kao argument pri pozivanju document.write.

Važno je napomenuti da funkcija može vratiti samo jednu vrijednost:

Jednostavan primjer funkcije JavaScript funkcije addValues(value1, value2) ( return value1 + value2; ) document.write("Rezultat = " + addValues(10, 20));< 20"); }

JavaScript onclick funkcije također se mogu koristiti u uvjetnim izjavama. Na primjer: jednostavan primjer funkcije funkcije JavaScript addValues(value1, value2) ( return value1 + value2; ) if (addValues(10, 20) > 20) ( document.write("Result > 20"); ) else ( document.write ( "Rezultat

Gdje smjestiti deklaracije funkcija Postoje dva mjesta gdje se preporučuje postavljanje JavaScript deklaracije povratak funkcije: unutar odjeljka HTML dokumenta ili unutar njega vanjska datoteka

.js. Druga se opcija smatra najpoželjnijom lokacijom jer pruža najveću fleksibilnost.

Cilj kreiranja funkcija je učiniti ih što općenitijim kako bi se povećala mogućnost ponovne upotrebe.

Prijevod članka “Razumijevanje JavaScript funkcija” pripremio je prijateljski projektni tim.

Dobro Loše Ideje dinamičkog generiranja sadržaja na web resursu postale su norma. Statične stranice

i izrada predložaka web stranice konačno su završili svoju misiju.

Međutim, moderan web resurs ne mora nužno biti predstavljen skupom stranica koje je generirao poslužitelj i ažurirao preglednik (JS+AJAX). Kada posjetitelj dođe, web izvor se može sastojati od nekoliko zaglavlja za protokol, nešto teksta u "headu", nekoliko redaka koda u "body" i to je to. ostalo" doći će na ideju

” prema iskustvu posjetitelja - ovo je idealno mjesto ili to želi biti.

Mjesto opisa i suština funkcija JavaScript je iskustvo stečeno desetljećima. On ima značajna povijest

razvoj, suvremeni kvalificirani tim kreatora i programera. Jezik je dobro osmišljen, pouzdan, lijep i daje programerima pravu priliku da napišu pristojan kod i poboljšaju se.

Skripta je mjesto za opisivanje potrebnih varijabli i funkcija, a ne dobar komad koda napisan sam za sebe. Suštinski i značajan je skup funkcija, možda njihova međusobna neposredna povezanost, ali češće je sve drugačije. Mjesto gdje je funkcija opisana i mjesto gdje je primijenjena nije uopće ista stvar.

Uopće nije nužno da će funkcija pozvati drugu funkciju izravno; to može učiniti neizravno kroz dinamičko generiranje koda. Posjetitelj unutar tog koda donosi odluku i pokreće se potpuno drugačiji sustav funkcija.

Funkcionalna dinamika

Funkcionalna dinamika nisu samo i ne toliko rukovatelji dodijeljeni elementima stranice, to su funkcije koje tvore elemente stranice, a izravni rukovatelji također se mogu mijenjati.

Radnja na stranici odvija se ovisno o njezinim elementima i ponašanju posjetitelja na njoj. Pokreti miša, gumbi tipkovnice, klikovi, događaji elemenata i druge okolnosti dovode do pokretanja potrebnih funkcija.

U početku nema slijeda i nema paralelizma. Postoji adekvatan odgovor web resursa na događaje. Koliko će brzo JavaScript izvršiti određenu funkciju ovisi o mnogim tehničkim (računalo, komunikacijske linije) i semantičkim (logika algoritma, predmetno područje, značenje zadatka) faktori.

Zapravo, može se tvrditi da je nešto radilo paralelno, a nešto će se ispuniti nakon nečeg drugog, ali tu nema nekog posebnog smisla. Važno je da JavaScript funkcije daju mogućnost kreiranja adekvatnog odgovora na akcije posjetitelja.

Ovo je novo razmišljanje u razvoju: distribuirana obrada informacija u utrobi jednog preglednika!

Sintaksa varijabli i funkcija

JavaScript varijable smještene su u oznaku "script" iu tijelo funkcije. Funkcije su definirane na isti način. Nema posebnog smisla pisati drugu funkciju unutar funkcije, ali to može biti potrebno iz raznih i dobro utemeljenih razloga.

Opis funkcije općenito počinje ključnom riječi "funkcija", nakon koje slijedi njen naziv, popis argumenata u zagradama odvojenih zarezima i tijelo funkcije u vitičaste zagrade.

U u ovom primjeru opisane su dvije funkcije koje omogućuju AJAX razmjenu između stranice i poslužitelja. Varijabla scXHR je gore opisana, stoga je dostupna i u InitXML i unutar WaitReplySC.

Naziv funkcije i parametar "funkcija".

Ovdje je uvedena asinkrona opcija, gdje se JavaScript funkcija u funkciji poziva nakon što poslužitelj odgovori. Istovremeno, nakon što primi odgovor od poslužitelja, WaitReplySC pristupa oznakama stranice, ispunjava ih primljenim informacijama i poziva druge funkcije koje mogu pokrenuti sljedeći zahtjev prema poslužitelju.

Ovdje je također važno napomenuti da je WaitReplySC funkcija. Ali u redu scXHR.onreadystatechange = WaitReplySC prosljeđuje se kao parametar. Ovaj opće pravilo prosljeđivanje funkcija drugim funkcijama kao parametara. Navedite zagrade i proslijedite svoje parametre u njih - funkcija će se odmah izvršiti. Rekao mi je samo svoje ime, ali što onda. Poziv funkcije izvršit će onaj tko je dobio ime.

Funkcionalnost implementirana putem AJAX-a omogućuje vam pozivanje JavaScript funkcije putem podataka primljenih s poslužitelja. Zapravo, prilikom slanja zahtjeva poslužitelju određena funkcija možda uopće ne "zna" kojoj funkciji pristupa i s kojim informacijama.

Izlaz iz funkcije i njen rezultat

U tijelu funkcije možete napisati bilo koji operator jezika, koji je zapravo namijenjen za tu svrhu. Varijable definirane unutar i izvan funkcije dostupne su unutar funkcije, ali ne i one definirane u drugim funkcijama.

Ako želite da funkcija vrati rezultat, možete koristiti JavaScript povratnu naredbu: return. U tijelu funkcije može postojati dovoljan broj naredbi return. Uopće nije nužno da svi vraćaju isti tip rezultata.

Obično programeri jako poštuju ovu značajku i, ovisno o situaciji, odlučuju napustiti značajku što je prije moguće.

Uopće nije potrebno prolaziti kroz cijeli algoritam funkcije kada možete izaći ranije.

Argumenti funkcije

Argumenti funkcije prosljeđuju se kao lista odvojena zarezima, u zagradama i smještena odmah iza njenog naziva. Nazivi varijabli koriste se kao argumenti, ali vrijednosti se također mogu proslijediti izravno. Da biste funkciju proslijedili funkciji u JavaScriptu, trebate samo navesti njezin naziv bez zagrada.

Unutar funkcije dostupna je varijabla argumenata koja ima svojstvo duljine. Možete pristupiti bilo kojem argumentu funkcije preko argumenata, argumenata,... do zadnjeg argumenta.

Promjena argumenta funkcije važeća je unutar funkcije, ali ne i izvan nje. Da biste promijenili nešto izvan funkcije, morate koristiti JavaScript operator return, kroz koji treba proći tražena vrijednost van.

Nakon završetka funkcije, sve što je povezano s njezinim izvršenjem bit će uništeno. Tijekom izvođenja funkcija može mijenjati vanjske varijable, osim onih opisanih u drugim funkcijama, uključujući interne.

arguments ima svojstvo callee, koje se koristi za pozivanje funkcije, što se radi u u trenutku vrijeme. Ako se onda sam javiš opcija JavaScript funkcija unutar funkcije omogućit će vam implementaciju rekurzije.

Korištenje funkcija

Glavna briga funkcija je posluživanje događaja preglednika. Da biste to učinili, u gotovo svakoj oznaci moguće je navesti naziv događaja i funkciju koja ga obrađuje. Može se navesti više događaja, ali samo je jedna funkcija navedena po događaju.

Jedna funkcija može služiti više elemenata stranice i više događaja. Pomoću parametra "this" možete proslijediti informacije funkciji odakle je pozvana.

Klasična upotreba JS funkcija su rukovatelji događajima na elementima. U ovom primjeru, funkcija scfWecomeGo() ili scfWelcomeCancel() bit će pozvana u obrascu za prijavu/odjavu posjetitelja, a scfMenuItemClick(this) prilikom odabira načina rada.

U potonjem slučaju, prosljeđuje se parametar "this", koji vam omogućuje da čudesno saznate iz kojeg je diva došao poziv. Općenito, JavaScript je tako dobro ugrađen u DOM i tako vam praktično omogućuje navigaciju kroz njegove elemente, prikupljanje potrebne informacije ta dinamika stranice može biti jednostavno nepredvidiva.

Funkcija ne mora vratiti niz znakova, broj ili drugu funkciju. Može vratiti potpuni HTML element, koji će sadržavati potreban broj elemenata, s vlastitim rukovateljima događajima.

Postavljanjem takvog elementa na stranicu programer stvara nova funkcionalnost, što je dobro u smislu rješavanja problema i zadovoljavanja interesa posjetitelja, ali dosta teško u smislu provedbe.

Kada započnete ovakav razvoj sa svim značajkama, lako se zbuniti. vlastiti kod, u pozivima funkcija, u trenucima kada se formira ovaj ili onaj sadržaj ovog ili onog dijela stranice. Prije nego krenete u ovom smjeru razvoja, ne škodi sve pažljivo odvagnuti.

O distribuiranom razmišljanju

Programer mora razmišljati na razini svih elemenata stranice, na razini svih događaja i imati jasnu predodžbu kako se sve zapravo događa. Teško je, ali rad se isplati.

U izvođenje JavaScripta funkcije se mogu odgoditi do nekog događaja, a takvih funkcija može biti mnogo, a događaji imaju tendenciju širenja i padaju u "opseg vidljivosti" raznih rukovatelja.

U ovom je primjeru negdje ranije pozvana funkcija koja je pokrenula stvaranje stavke izbornika za navigaciju datoteke. Pretpostavlja se organizacija stranice, odnosno u prozoru postoji samo sedam datoteka koje je moguće brisati i obrađivati. Možete se kretati klikom na redak datoteke, koristeći strelice na tipkovnici ili u blokovima od sedam redaka.

Svaki slučaj ima svoje funkcije. Drugim riječima, u takvim jednostavan primjer trebate napisati nekoliko desetaka funkcija koje će odgovarati na različite događaje, a neke od tih funkcija će obraditi razne opcije i situacije koje uopće nisu događaji.

Na primjer, kada izbrišete redak, donji bi se trebali pomaknuti prema gore. Da biste to učinili, morat ćete ili napraviti novi odabir, što je trivijalno i zahtjevno, ili ponovno izračunati linije, koristiti funkcije polja u javascriptu i elegantno postići cilj.

Argumenti funkcije i rezultati

JavaScript vam omogućuje da svoj kod dovedete u "potpuno funkcionalno" stanje. Normalno je da argument funkcije bude funkcija. Opcija je dopuštena kada funkcija vraća funkciju. JavaScript je potpuno opušten po tom pitanju.

Ovo je dobar mehanizam, ali prilično složen u smislu implementacije. Tehnički, sve je dopušteno; samo kvalificirani programer može semantički osigurati logiku za prijenos "funkcionalnosti".

Kada u JavaScript funkcija u funkciji - bez obzira na sve, ali kada funkcija generira funkciju, a ova generira drugu, onda je dosta teško pratiti logiku. U biti, nije pitanje primjene kvalifikacije, pitanje je dobivanja sigurnog i ispravnog rezultata.

Zabrinutost programera je jasna i jednostavna. Postoji problem, potrebno vam je rješenje, a ne pogreška poput "JavaScript greška operacija je nesigurna", prazan ekran ili zaustavljanje cijelog pretraživača.

Ako je argument funkcija, tada programer prosljeđuje varijablu s posebnim svojstvima, to jest, to nije broj, ni niz, ni objekt. Ali korištenje takvog argumenta može dovesti do promjene vanjskih varijabli i rezultata funkcije koja se izvršava. Ovisno o tome što se prenosi, izvršit će se odgovarajuće izmjene.

Izvršenje generiranog koda

Možete implementirati izvršenje koda generiranog tijekom rada drugog koda pomoću "eval". Ovo se ne smatra izvrsnim rješenjem, ali često ne možete komplicirati kod nepotrebnim funkcijama, već se ograničiti na banalnu formaciju JavaScript nizovi kod i jednostavno ga izvršite.

U ovom primjeru, linija se generira za umetanje nekih informacija u trenutni div. Div broj i sadržaj informacija različiti su za različite pozicije, pa nije zajamčeno da će takvo rješenje u ovoj situaciji pružiti situaciju "javascript pogreške operacija je nesigurna", ali će pouzdano dati željeni učinak.

Nijansa JavaScript paradigme "funkcija unutar funkcije".

Ako postoji prilika da to učinite bez ukrasa, bolje je iskoristiti je. Sve navedene opcije su dobre. Naravno, u mnogim slučajevima to je jedino rješenje.

Klasičan primjer rekurzije: izračunavanje faktorijela. Prilično je teško napisati algoritam koji ide u petlju, ali je vrlo lako ići izvan granica vrijednosti. Faktorijel raste prebrzo.

Međutim, normalne su i rekurzija i funkcija koja poziva drugu funkciju koja može izvršiti važeći povratni poziv.

Na primjer, redoviti stol. U tablici mogu biti i drugi stolovi. Gniježđenje se ne može ograničiti. Pisanje vlastitog skupa funkcija za svaku tablicu prevelik je luksuz.

Mnogo je takvih primjera koji se mogu navesti, a sve će to biti stvarni i hitni zadaci, nimalo iz područja programiranja. Zato je problem upravo u tome što stvoreni sustav funkcionira, odnosno njegovo otklanjanje pogrešaka i naknadno pouzdan rad postaje briga ne za JavaScript, već za programera.

Zadnja izmjena: 09.04.2018

Funkcije su skup instrukcija koje izvode određenu radnju ili izračunavaju određenu vrijednost.

Sintaksa definicije funkcije:

Funkcija naziv_funkcije([parametar [, ...]])( // Upute)

Definicija funkcije počinje ključnom riječi function nakon koje slijedi naziv funkcije. Naziv funkcije slijedi ista pravila kao i naziv varijable: može sadržavati samo brojeve, slova, podvlake i znakove dolara ($) i mora započeti slovom, podvlakom ili dolarom.

Nakon naziva funkcije, parametri su navedeni u zagradama. Čak i ako funkcija nema parametara, ona jednostavno sadrži prazne zagrade. Zatim, u vitičastim zagradama, dolazi tijelo funkcije, koje sadrži skup instrukcija.

Definirajmo najjednostavniju funkciju:

Funkcija display())( document.write("funkcija u JavaScriptu"); )

Ova funkcija se zove display(). Ne prihvaća nikakve parametre i sve što radi je upisivanje niza na web stranicu.

Međutim jednostavna definicija Značajka još nije dovoljna za rad. Još je moraš nazvati:

funkcija prikaz())( dokument.write("funkcija u JavaScriptu"); ) prikaz();

Funkcijama nije potrebno dati određeni naziv. Možete koristiti anonimne funkcije:

Var display = function())( // definicija funkcije document.write("funkcija u JavaScriptu"); ) display();

Ono što mi radimo je zapravo definiranje varijable prikaza i dodjeljivanje referentne funkcije. A onda po imenu varijabla funkcija nazvao.

Također možemo dinamički dodijeliti funkcije varijabli:

Function goodMorning())( document.write("Dobro jutro"); ) function goodEvening())( document.write("Dobro veče"); ) var message = goodMorning; poruka(); // Poruka za dobro jutro = goodEvening; poruka(); // Dobro veče

Parametri funkcije

Razmotrimo prosljeđivanje parametara:

Funkcija display(x)( // definicija funkcije var z = x * x; document.write(x + " na kvadrat jednako " + z); ) display(5); // poziv funkcije

Funkcija prikaza uzima jedan parametar - x. Stoga, kada pozivamo funkciju, možemo joj proslijediti vrijednost, na primjer, broj 5, kao u ovom slučaju.

Ako funkcija uzima nekoliko parametara, tada pomoću operatora širenja... možemo proslijediti skup vrijednosti za ove parametre iz niza:

Funkcija sum(a, b, c)( neka d = a + b + c; console.log(d); ) sum(1, 2, 3); neka brojevi = ; zbroj(...brojevi);

U drugom slučaju, funkciji se prosljeđuju brojevi iz niza nums. Ali kako bi se prenio ne samo niz kao jedna vrijednost, već brojevi iz tog niza, koristi se operator širenja (elipsa...).

Neobavezni parametri

Funkcija može uzeti mnogo parametara, ali neki ili svi parametri mogu biti izborni. Ako za parametre nije proslijeđena vrijednost, zadani su "nedefinirani".

Funkcija display(x, y)( if(y === nedefinirano) y = 5; if(x === nedefinirano) x = 8; neka je z = x * y; console.log(z); ) display() ; // 40 prikaz(6); // 30 prikaz(6, 4) // 24

Ovdje funkcija prikaza uzima dva parametra. Kada pozivamo funkciju, možemo provjeriti njihove vrijednosti. Međutim, kada pozivate funkciju, nije potrebno proslijediti vrijednosti za ove parametre. Za provjeru prisutnosti vrijednosti parametra koristi se usporedba s nedefiniranom vrijednošću.

Postoji još jedan način definiranja zadanih vrijednosti za parametre:

Funkcija display(x = 5, y = 10)( neka je z = x * y; console.log(z); ) display(); // 50 prikaz(6); // 60 prikaz(6, 4) // 24

Ako parametrima x i y nisu proslijeđene vrijednosti, oni se dobivaju kao vrijednosti brojeva 5 odnosno 10. Ova metoda je konciznija i intuitivnija od usporedbe s nedefiniranim.

U ovom slučaju može se izvesti zadana vrijednost parametra, koja predstavlja izraz:

Funkcija display(x = 5, y = 10 + x)( neka je z = x * y; console.log(z); ) display(); // 75 prikaz(6); // 96 prikaz(6, 4) // 24

U ovom slučaju vrijednost parametra y ovisi o vrijednosti x.

Ako je potrebno, sve proslijeđene parametre možemo primiti globalno dostupan niz argumenti:

Funkcija display())( var z = 1; for(var i=0; i