Funkcia je blok kódu, ktorý vykonáva akciu alebo vracia hodnotu. Funkcie sú vlastný kód, ktorý možno znova použiť; Preto sa vďaka funkciám programy stávajú modulárnymi a produktívnejšími.

Tento tutoriál ponúka niekoľko spôsobov, ako definovať a volať funkciu a používať parametre funkcie v JavaScripte.

Definícia funkcie

Funkcie sú definované alebo deklarované pomocou kľúčového slova function. Syntax funkcie v JavaScripte vyzerá takto:

function nameOfFunction() (
// Kód, ktorý sa má vykonať
}

Deklarácia funkcie začína kľúčovým slovom function, za ktorým nasleduje názov funkcie. Názvy funkcií sa riadia rovnakými pravidlami ako názvy premenných: môžu obsahovať písmená, čísla, podčiarkovníky a znaky dolára a často sa píšu s veľkými písmenami. Za názvom nasleduje skupina zátvoriek, ktoré možno použiť pre voliteľné parametre. Kód funkcie je obsiahnutý v zložených zátvorkách, ako napríklad príkaz for alebo if.

Ako ste si mohli všimnúť, hodnota parametra name nie je v kóde priradená, to sa deje pri volaní funkcie. Pri volaní funkcie sa ako argument odovzdá používateľské meno. Argument je skutočná hodnota, ktorá sa odovzdá funkcii (v tomto prípade používateľské meno, napríklad 8host).

// Vyvolajte funkciu pozdravu s argumentom "8host".
pozdrav("8hostiteľ");

Hodnota 8host sa odovzdá funkcii cez parameter name. Teraz bude parameter name reprezentovať túto hodnotu v tejto funkcii. Kód súboru greetUser.js vyzerá takto:

// Inicializácia vlastnej funkcie pozdravu
funkcia pozdrav(meno) (
console.log(`Dobrý deň, $(meno)!`);
}
// Vyvolajte funkciu pozdravu s argumentom "8host".
pozdrav("8hostiteľ");

Keď spustíte tento program, dostanete nasledujúci výstup:

Teraz viete, ako znova použiť funkciu.

Okrem parametrov môžu byť vo funkciách deklarované aj premenné. Tieto premenné sa nazývajú lokálne a existujú iba v rámci svojho funkčného bloku. Rozsah premenných určuje dostupnosť premenných; Premenné, ktoré sú definované vo vnútri funkcie, nie sú prístupné zvonku funkcie, ale možno ich použiť toľkokrát, koľkokrát sa v programe použije funkcia, ku ktorej patria.

Vracia sa hodnoty

Vo funkcii môžete použiť viac ako jeden parameter. Funkcii môžete odovzdať viacero hodnôt a vrátiť hodnotu. Vytvorte napríklad súbor sum.js a deklarujte v ňom funkciu, ktorá nájde súčet dvoch hodnôt x a y.

// Inicializácia funkcie pridávania
funkcia add(x, y) (
návrat x + y;
}

add(9, 7);

Tento kód definuje funkciu s parametrami x a y. Funkcia potom získa hodnoty 9 a 7. Spustite program:

Program spočíta výsledné hodnoty 9 a 7 a vráti výsledok 16.

Kedy použiť kľúčové slovo return, funkcia sa zastaví a vráti hodnotu výrazu. V tomto prípade prehliadač zobrazí hodnotu v konzole, ale to nie je to isté ako použitie console.log() na výstup do konzoly. Keď je funkcia zavolaná, odošle hodnotu tam, odkiaľ bola volaná. Túto hodnotu možno použiť alebo umiestniť do premennej.

Funkčné výrazy

V predchádzajúcej časti ste deklarovali funkciu, ktorá sčíta dve čísla a vráti výslednú hodnotu. Výraz funkcie môžete vytvoriť aj priradením funkcie k premennej.

Pomocou predchádzajúcej funkcie aplikujte výslednú hodnotu na premennú súčtu.

// Priraďte funkciu sčítania súčtovej konštante
const sum = funkcia add(x, y) (
návrat x + y;
}
// Vyvolajte funkciu na nájdenie súčtu
suma(20, 5);
25

Teraz je konštantný súčet funkciou. Tento výraz je možné skrátiť prevedením na anonymnú funkciu (takto sa nazývajú funkcie bez parametra name). V súčasnosti sa funkcia nazýva add, ale vo funkčných výrazoch sa názov zvyčajne vynecháva.

// Priraďte funkciu súčtovej konštante
const sum = funkcia (x, y) (
návrat x + y;
}
// Vyvolajte funkciu na nájdenie súčtu
suma(100, 3);
103

Teraz funkcia už nemá názov, stala sa anonymnou.

Výrazy pomenovaných funkcií možno použiť na ladenie.

Funkcie šípok

Doteraz boli funkcie definované pomocou kľúčového slova function. Existuje však novší a výstižnejší spôsob definovania funkcie – šípkové funkcie ECMAScript 6. Funkcie šípok sú reprezentované znamienkom rovnosti, za ktorým nasleduje znamienko väčšie ako: =>.

Funkcie šípok sú vždy anonymné a sú typom výrazu funkcie. Skúste vytvoriť základnú funkciu šípky na nájdenie súčtu dvoch čísel.

// Definovanie funkcie násobenia
const multiply = (x, y) => (
návrat x * y;
}

multiply(30, 4);
120

Namiesto funkcie písania môžete jednoducho použiť symboly =>.

Ak má funkcia iba jeden parameter, zátvorky možno vynechať. V nasledujúcom príklade funkcia odmocňuje x, takže ako argument potrebuje iba jedno číslo.

// Definícia štvorcovej funkcie
konštantný štvorec = x => (
návrat x * x;
}
// Vyvolanie funkcie na nájdenie produktu
štvorec(8);
64

Poznámka: Ak funkcia šípky nemá žiadne parametre, musíte pridať prázdne zátvorky ().

Funkcie šípok, ktoré pozostávajú iba z príkazu return, možno skrátiť. Ak funkcia pozostáva iba z jedného návratového riadku, môžete vynechať zložené zátvorky a príkaz return, ako v príklade nižšie.

// Definícia štvorcovej funkcie
const square = x => x * x;
// Vyvolanie funkcie na nájdenie produktu
štvorec(10);
100

Záver

Tento tutoriál vás zoznámi s deklarovaním funkcií, funkčných výrazov a funkcie šípok, vrátenie hodnôt a priradenie funkčných hodnôt premenným.

Funkcia je blok kódu, ktorý vracia hodnotu alebo vykonáva akciu.

Značky:

Premenné a konštanty v JavaScripte. Deklarovanie premenných a priraďovanie hodnôt k nim. Globálne a lokálne premenné. Použitie konštánt

Deklarovanie premenných v JavaScripte

Názvy premenných v JavaScripte môžu pozostávať z písmen, číslic, znaku $ a znaku _ a názov premennej nemôže začínať číslom. Majte na pamäti, že JavaScript rozlišuje veľké a malé písmená a premenné a1 a A1 sú rôzne premenné. Neodporúča sa používať azbuku, aj keď je to možné.
Premenné v JavaScripte sú deklarované pomocou kľúčového slova var:

Var Peremennaya_1 var Peremennaya_2

Neodporúča sa používať premenné v JavaScripte bez deklarácie. Je to možné, ale môže to viesť k chybám.

Priradenie hodnôt k premenným

Priradenie hodnoty deklarovaným premenným v JavaScripte:

Peremennaya_1 = 25 Peremennaya_2 = "Priradený text je uzavretý v rovných úvodzovkách"

Hodnotu môžete premenným priradiť hneď po deklarácii:

Var Peremennaya_1 = 25 var Peremennaya_2 = "Priradený text je uzavretý v rovných úvodzovkách"

Hodnota premennej v JavaScripte sa môže počas vykonávania programu meniť. Pri písaní textu do premennej musí byť táto vložená do rovných úvodzoviek.

Lokálne a globálne premenné

Ak je premenná deklarovaná vo funkcii, potom je miestne a budú dostupné (viditeľné) iba v rámci tejto funkcie. Keď sa funkcia ukončí, lokálne premenné v JavaScripte sa zničia, takže premenné s rovnakým názvom môžete použiť v rôznych funkciách.

Ak je premenná deklarovaná mimo funkcií, potom je globálne a budú dostupné (viditeľné) vo všetkých funkciách na stránke. Pri zatvorení stránky sa v JavaScripte zničia globálne premenné.

Konštanty v JavaScripte

Konštanty sú navrhnuté tak, aby uľahčili prácu s kódom, keď musíte použiť duplicitné hodnoty alebo výrazy. Hodnotu konštanty stačí nastaviť raz a vložením do kódu svojich programov ju môžete používať akokoľvek. JavaScript nemá kľúčové slovo na deklarovanie konštánt, namiesto konštánt sa používajú bežné premenné. Na rozlíšenie konštánt od premenných sa zvyčajne označujú veľkými písmenami, v prípade potreby pomocou podčiarknutia:

Var DRUG_CHELOVEKA = "Pes"

Uvedený príklad konštanty nie je úplne úplný, pretože slovo „Pes“ je už ľahko zapamätateľné a vložené tam, kde je to potrebné. Konštanty v JavaScripte môžete použiť na zaznamenávanie a vkladanie zložitejších hodnôt, napríklad ťažko zapamätateľné kódy, znakové sady, dlhý text, webové adresy, adresy Email, telefónne čísla, rôzne koeficienty.

V JavaScripte môžu byť konštanty prepísané ako premenné, ale ak to urobíte, význam konštánt sa stratí.

V tomto článku sa dozviete, ako určiť konštanty v JavaScripte pomocou kľúčového slova const.

ES6 poskytuje nový spôsob, ako deklarovať konštanty pomocou kľúčového slova konšt. Kľúčové slovo konšt vytvorí odkaz na hodnotu len na čítanie.

Const VARIABLE_NAME = hodnota;

po dohode Konštantné identifikátory JavaScriptu sú veľké.

Kľúčové slovo konšt vyzerá ako kľúč slovo nechať v tom, že vytvára premenné s rozsahom bloku, ale hodnoty deklarované pomocou const, nemožno zmeniť.

Premenné deklarované pomocou kľúčového slova nech sú premenlivý. To znamená, že ich hodnoty môžete kedykoľvek zmeniť, ako je znázornené v nasledujúcom príklade.

Nech v = 10;
v = 20;
v = v + 5;
console.log(v); // 35

Avšak premenné vytvorené pomocou kľúčového slova konšt, sú nemenné. Inými slovami, nemôžete im priradiť iné hodnoty. Pokus o opätovné priradenie konštantnej premennej bude mať za následok chybu typu TypeError .

Const TAX = 0,1;
DAŇ = 0,2 ; //TypeError

Navyše premenná, ktorá je deklarovaná pomocou kľúčového slova const, musí byť okamžite inicializovaný s hodnotou. Nasledujúci príklad volá Chyba syntaxe(syntaktická chyba) z dôvodu absencie inicializátora v deklarácii konštantnej premennej.

Const RED; // Chyba syntaxe

Ako už bolo spomenuté, ako premenné deklarované pomocou kľúčového slova nech, premenné deklarované pomocou kľúčového slova const, majú blokový rozsah.

To je všetko a v ďalšom článku si povieme niečo o používaní kľúčového slova konšt s objektovými literálmi v JavaScript.

Keď program potrebuje uložiť hodnotu, aby ju mohol neskôr použiť, táto hodnota sa priradí premennej. Premenná je jednoducho symbolický názov pre hodnotu, ktorý poskytuje možnosť získať hodnotu podľa názvu, to znamená, že keď program zadá názov premennej, nahradí sa hodnotou.

Premenná dostala svoj názov vďaka tomu, že jej hodnotu možno meniť počas vykonávania programu.

Konštanty

Konštanta je jednoducho symbolický názov hodnoty. Konštanta vám umožňuje odkazovať na hodnotu podľa názvu, čo znamená, že keď program špecifikuje názov konštanty, hodnota sa namiesto toho nahradí. Konštanty slúžia na ukladanie údajov, ktoré by sa nemali meniť počas vykonávania programu.

Pred použitím konštanty je potrebné ju deklarovať. Konštanty sa deklarujú pomocou kľúčového slova const, za ktorým nasleduje názov konštanty. Aby bolo možné odlíšiť konštanty od premenných v programovom kóde, bolo dohodnuté dávať konštantám názvy napísané veľkými písmenami:

Const MAX = 10;

Po vytvorení konštanty spôsobí pokus o jej predefinovanie na premennú alebo pokus o priradenie hodnoty existujúcej konštante chybu.

Prečo sú potrebné premenné a konštanty?

Pomáhajú vám premenné a konštanty programový kód jasnejšie. Pozrime sa na malý príklad:

Celková cena = 2,42 + 4,33; // Celková cena

Čísla tu môžu znamenať čokoľvek. Aby bolo jasné, čo sa tu presne zhŕňa, hodnotu 2,42 možno priradiť k premennej (alebo konštantnej) candyPrice (cena cukríkov) a 4,33 k premennej (alebo konštantnej) oilPrice (cena ropy):

Celková cena = cena cukríkov + cena oleja;

Teraz, namiesto toho, aby ste si pamätali, čo tieto hodnoty znamenajú, môžete vidieť, že skript pripočítava cenu cukríkov k cene masla.

Premenné a konštanty tiež pomáhajú šetriť čas pri ladení skriptu. Namiesto toho, aby ste všade používali rovnaký literál, môžete ho priradiť k premennej (alebo konštante) na začiatku skriptu a potom použiť premennú (alebo konštantu) namiesto literálu v celom zvyšku kódu skriptu. Ak sa neskôr rozhodne o zmene hodnoty, zmeny v kóde budú musieť byť vykonané nie na niekoľkých miestach, ale iba na jednom mieste - tam, kde bola hodnota priradená premennej (alebo konštante).

Rozsah konštánt

Pre konštanty platia rovnaké pravidlá ako pre premenné deklarované kľúčovým slovom let:

Const MAX = 5; // Globálna konštanta ( const MAX = 10; // Bloková konštanta console.log(MAX); // 10 ) console.log(MAX); // 5 foo(); // 15 console.log(MAX); // 5 funkcií foo() ( const MAX = 15; // Lokálna konštanta console.log(MAX); )

Konštanty a referenčné typy

Keď je konštante priradená hodnota referenčného typu, odkaz na hodnotu sa stane nemenným a samotná hodnota zostane meniteľná:

Const obj = (a: 5); obj.a = 10; console.log(obj.a); // 10

Od autora: Možno to bude prekvapujúce, ale JavaScriptu dlho chýbala podpora konštánt, t.j. registrované hodnoty, ktoré sa nemenia počas vykonávania celého skriptu. Keďže neexistovali žiadne alternatívy, väčšina konštánt bola deklarovaná pomocou premenných.

Príklad deklarovania konštanty pomocou premennej:

var DAYSINWEEK = 7;

var DAYSINWEEK = 7 ;

Je to nebezpečné aj nepraktické, pretože vám to umožňuje kedykoľvek zmeniť hodnotu premennej DAYSINWEEK vo vašom skripte. Vývojári prišli s rôznymi spôsobmi, ako odlíšiť premenné, ktoré sú zdanlivo konštantné, od bežných premenných v JavaScripte, od pomenovania premenných LEN VEĽKÝMI PÍSMENAMI (najlepší postup) až po riešenia, o ktorých budem hovoriť neskôr. Našťastie v Najnovšia verzia ECMAScript (špecifikácia, ktorá je štandardom) zaviedol túto konštantu:

JavaScript. Rýchly štart

const DAYSINWEEK = 7;

const DAYSINWEEK = 7 ;

A teraz je DAYSINWEEK prístupný ako premenná, ale nikdy nebudete môcť zmeniť jej hodnotu:

console.log(DAYSINWEEK); > 7 DAYSINWEEK = 8; > chyba

konzoly. log(DAYSINWEEK); DAYSINWEEK = 8 ; > chyba

Po deklarovaní konštanty (konštanty musia byť inicializované kľúčovým slovom const, za ktorým nasleduje názov konštanty, ktorý sa riadi pravidlami pre pomenovanie premenných), jej názov bude rezervovaný: premennú už nemôžete pomenovať DAYSINWEEK a mať konštantu s rovnakým názvom , alebo naopak.

Kľúčové slovo const má dobrá podpora v moderných prehliadačoch: IE11 a Spartan, Firefox 31+, Opera 12+, Safari 5.1.7+, iOS 7 a vyšší, spolu s Chrome 36+. Existuje však niekoľko dôležitých upozornení:

Chrome nepodporuje zobrazenie chyby pri pokuse o prepísanie konštanty. Hodnota konštanty sa v žiadnom prípade nezmení, ale neskúsený vývojár si môže myslieť, že nová hodnota bola použitá, pretože sa nevyskytla žiadna chyba.

JavaScript. Rýchly štart

Naučte sa základy JavaScriptu s praktickým príkladom, ako vytvoriť webovú aplikáciu.

Konštanty sa nevytvárajú nová oblasť viditeľnosť vo Webkite. Tie. konštanty môžu byť viditeľné mimo aktuálneho rozsahu.

Firefox 35 a nižší vám umožňuje meniť hodnotu const za behu. Toto bolo opravené vo Firefoxe 36+.

Treba tiež poznamenať, že problémy s Webkit sa vyskytujú iba vtedy, ak sa nepoužíva striktný režim (o čom sa bude diskutovať v budúcom článku).

Je teraz možné použiť kľúčové slovo const v reálnych projektoch?

Voľba, či použiť alebo nepoužiť kľúčové slovo const vo svojom kóde, bude závisieť od niekoľkých faktorov: najdôležitejšie je, aké verzie prehliadačov používajú návštevníci vašej stránky, pretože použitie kľúčového slova const bude v prehliadačoch, ako je IE10, považované za chybu. . Ak chcete použiť kľúčové slovo const vo vývoji, ale nie ste pripravení ho použiť v reálnych projektoch, máte niekoľko možností:

Možnosť 1: použite transpilátor („transpiler“)

Transpilers, ako už názov napovedá, transformujú váš kód v čase kompilácie do iného jazyka: v tomto prípade z verzie špecifikácie ES6 (ktorá zaviedla kľúčové slovo const) na ES5. To vám umožní písať kód vo viacerých Nová verzia jazyk, ale skutočný projekt bude používať verziu, ktorá je kompatibilná so širším rozsahom prehliadačov. Zložil Eddie Osmani