JavaScript program je niz instrukcija (izjava). Ponekad se upute nazivaju i JavaScript naredbe.

Da bi se program mogao izvršiti, mora se pokrenuti. Ako je program klijentska skripta, tada ga automatski pokreće preglednik, ali samo ako je, naravno, prisutan u kodu stranice. Preglednik izvršava program, obično tijekom učitavanja web stranice.

Prilikom pisanja uputa moraju biti odvojene točkom i zarezom. JavaScript vam omogućuje da izostavite točku i zarez na kraju izjave if sljedeća uputa počet će s nova linija.

Završetak naredbi točkom i zarezom u JavaScriptu nije potreban ako će se sljedeća naredba napisati u novom retku, ali se toplo preporučuje. Također je preporučljivo staviti svaku uputu u poseban redak.

JavaScript upute sastoje se od: vrijednosti, operatora, izraza, ključnih riječi i komentara.

Na primjer, ova uputa govori pregledniku da napiše "Hello, world!" iznutra HTML element s id="main":

Document.getElementById("main").textContent = "Zdravo, svijete!";

JavaScript značenja

Sintaksa JavaScripta definira sljedeće vrste vrijednosti: fiksne vrijednosti (literali), konstantne vrijednosti i varijabilne vrijednosti.

Primjeri literala za predstavljanje različitih vrijednosti u JavaScriptu:

17 // cijeli broj literal 23.8 // frakcijski broj literal "HTML" // string literal "HTML" // string literal true // boolean literal // array literal // array literal () // object literal ( name: "Dennis " , jezik: "ru" ) // literal objekta (ab|bc) // literal regularnog izraza

U programskim jezicima, konstante i varijable se koriste za pohranu vrijednosti podataka.

Za deklariranje konstanti koristi se ključna riječ const, varijable – var i let.

Const MAX_LENGTH = 17; // konstanta var section = "HTML"; // varijabla let arr = ["HTML","CSS"]; // varijabla

let je novi način za deklariranje varijabli koji se pojavio od verzije ES-2015 (ES6). Let se razlikuje od var po tome što varijabla deklarirana pomoću let ima drugačiji opseg (blok scope), a također i po tome što joj se može pristupiti tek nakon što je kreirana.

JavaScript operatori

U JavaScriptu postoji mnogo različitih operatora. Oni označavaju operaciju koju je potrebno izvesti.

Ovisno o broju operanda s kojima operira operator, dijele se na binarne i unarne. Ali JavaScript također ima uvjetni operator koji se sastoji od 3 operanda. Ovaj se operator naziva ternarnim.

Na primjer, operator dodjele (= znak):

// operand1 = operand2; coorX = 100; // na primjer dodijelite broj 100 varijabli coordX

Ovaj se operator koristi za dodjelu (postavljanje) operand1 na istu vrijednost kao operand2.

Operator dodjele je binarni jer radi na dva operanda.

Na primjer, operator povećanja (znak ++) koristi se za povećanje brojčana vrijednost operand na 1:

Var num = 5; ++broj; // 6

Operator inkrementa je unarni jer radi na jednom operandu.

JavaScript izrazi

Izraz je kombinacija vrijednosti, varijabli i operatora koji ili dodjeljuju vrijednost varijabli ili vraćaju vrijednost bez dodjele.

Na primjer, izraz num = 955.47 koristi = operator za dodjelu vrijednosti 7 varijabli num.

Na primjer, izraz "Zdravo, " + "Timofej" koristi + operator za dodavanje nizova "Zdravo, " i "Timofej" bez dodjele.

JavaScript ključne riječi

JavaScript upute često počinju ključnom riječi. Ona (ključna riječ) ima za cilj odrediti koju radnju JavaScripta treba izvršiti.

Na primjer, ključna riječ var govori pregledniku da stvori varijable:

Var coordX = 5, coordY = 130;

Popis nekih ključnih riječi: break, continue, do ... while, for, function, if ... else, return, switch, try ... catch, var.

Komentari u JavaScriptu

Nisu sve JavaScript izjave izvršne.

Kod iza dvostrukih kosih crta // ili između /* i */ tretira se kao komentar.

Komentari se zanemaruju i ne izvršavaju:

Var direction = "top"; // komentar u jednom retku // var speed = 10; ova se instrukcija neće izvršiti /* Funkcija koja dodaje klasu show elementu s id="myBtn" */ function showBtn() ( document.getElementById("myBtn").classList.add("show"); )

// - je komentar u jednom redu, tj. sav tekst između // i kraja retka JavaScript će zanemariti (neće se izvršiti).

/* */ je višeredni komentar, svaki tekst između /* i */ će zanemariti JavaScript.

JavaScript blok instrukcija

JavaScript upute mogu se grupirati pomoću bloka (vitičaste zagrade (...)).

Obično se koristi u funkcijama, kontrolnim strukturama (za, dok) itd.

Funkcija myFunction() (document.getElementById("id__1").textContent = "Tekst 1..."; document.getElementById("id__2").textContent = "Tekst 2..."; )

Osjetljivost velikih i malih slova

JavaScript je jezik koji razlikuje velika i mala slova. To znači da ključne riječi, varijable, nazivi funkcija i drugi identifikatori jezika moraju sadržavati isti skup velikih i malih slova. Na primjer, metodu upozorenja treba upisati samo kao upozorenje, a ne Upozorenje, UPOZORENJE itd.

Praznina u JavaScriptu

JavaScript zanemaruje više razmaka. Svojoj skripti možete dodati razmake kako bi bila čitljivija.

Sljedeći redovi su ekvivalentni:

Var str = "Tekst"; var str="Tekst";

Duljina retka koda

Ako je JavaScript instrukcija dugačka, preporučljivo ju je prekinuti. U većini slučajeva, bolje je prekinuti instrukciju nakon nekog operatora.

Na primjer:

Document.getElementById("aside__nav_header").innerHTML = "Dodatna navigacija (po odjeljku)";

• naziv koji se sastoji od jedne riječi treba pisati malim slovima (primjerice: članak);
• naziv koji se sastoji od više riječi treba pisati malim slovima zajedno, osim slova na spoju riječi treba ih pisati velikim slovima (npr.: Naslov članka);
• broj riječi u nazivu ne smije biti veći od 3 (na primjer: articleDatePublishedon)
• varijable (ne za pohranu funkcija) i svojstva objekta moraju biti imenice (na primjer: textComment);
• nizove i zbirke vrijednosti treba navesti imenicama u plural(na primjer: zadnjiKomentari);
• funkcije i metode objekata moraju biti imenovane glagolima (na primjer: getLastArticles);
• nazivi klasa moraju počinjati velikim slovom (na primjer: Komentari).

JavaScript se može implementirati pomoću JavaScript operatori, koji se postavljaju u HTML oznake skripta ... /skripta na web stranici.

Oznake skripte koje sadrže vaš JavaScript možete postaviti bilo gdje na svojoj web stranici, ali općenito se preporučuje da ih pohranite u oznake glave.

Oznaka skripte upozorava program preglednika da počne tumačiti sav tekst između ovih oznaka kao skriptu. Jednostavna sintaksa za vaš JavaScript izgledala bi ovako.

JavaScript kod

Oznaka skripte sadrži dva važna atributa -

• Jezik - Ovaj atribut označava koji skriptni jezik koristite. Obično će njegova vrijednost biti javascript. Iako su novije verzije HTML-a (i XHTML-a, njegovog nasljednika) prestale koristiti ovaj atribut.
• Tip. Ovaj se atribut sada preporučuje za označavanje korištenog skriptnog jezika, a njegova bi vrijednost trebala biti postavljena na "text/javascript".

Vaš bi JavaScript segment izgledao ovako:

JavaScript kod

Vaša prva JavaScript skripta

Uzmimo primjer ispisa "Hello World". Dodali smo dodatni komentar HTML koji okružuje naš JavaScript kod. Ovo je za spremanje našeg koda iz preglednika koji ne podržava JavaScript. Komentar završava s "// ->". Ovdje "//" označava komentar u JavaScriptu, pa ovo dodajemo kako bismo spriječili preglednik da pročita kraj HTML komentara kao dio JavaScript koda. Zatim pozivamo funkciju document.write, koja zapisuje niz u naš HTML dokument.

Ova se funkcija može koristiti za pisanje teksta, HTML-a ili oboje. Pogledajte sljedeći kod.

Ovaj kod će dati sljedeći rezultat:

Pozdrav svijete!

Razmaci i prijelomi redaka

JavaScript zanemaruje razmake, kartice i nove retke koji se pojavljuju u JavaScript programima. Možete slobodno koristiti razmake, kartice i nove retke u svom programu, a možete formatirati i uvlačiti svoje programe na uredan i dosljedan način, čineći vaš kod lakim za čitanje i razumijevanje.

Točka-zarez u JavaScriptu

U jednostavne upute u JavaScriptu obično slijedi točka sa zarezom, kao u C, C++ i Javi. JavaScript vam, međutim, omogućuje preskakanje ove točke i zareza ako svaku svoju izjavu stavite u zaseban redak. Na primjer, sljedeći kod bi se mogao napisati bez točke-zareza.

Ali kada ovako formatirate u jednom retku, morate koristiti točku-zarez -

Bilješka. Dobra vježba programiranje je korištenje točke-zareza.

Osjetljivost velikih i malih slova

JavaScript je jezik koji razlikuje velika i mala slova. To znači da se ključne riječi, varijable, nazivi funkcija i svi drugi identifikatori uvijek moraju unositi dosljednim velikim slovom.

Tako će identifikatori Time i TIME prenijeti različita značenja JavaScriptu.

BILJEŠKA. Trebali biste biti oprezni kada pišete nazive varijabli i funkcija u JavaScriptu.

Kada uči pisati, osoba mora naučiti osnove pravopisa, gramatike i pravopisa. Na primjer, svi znaju da rečenica počinje s veliko slovo a završava točkom, tekst je podijeljen na odlomke itd.

Programski jezici rade na sličan način: da bi program radio, moraju se poštovati određena pravila. Skup pravila koja definiraju strukturu programskih jezika naziva se sintaksa. Mnogi programski jezici izgrađeni su na istim konceptima, ali koriste različitu sintaksu.

Ovaj vodič će vas upoznati s osnovama sintakse i strukturiranja koda u JavaScriptu.

Funkcionalnost i čitljivost

Funkcionalnost i čitljivost vrlo su važni aspekti JavaScript sintakse na koje se treba posebno usredotočiti.

Neka pravila sintakse obavezna su za JavaScript kôd. Ako nisu zadovoljeni, konzola će izbaciti pogrešku i skripta će se prestati izvoditi.

Razmotrite ovu pogrešku u programu "Hello, World!".

// Primjer pokvarenog JavaScript programa
console.log("Zdravo, svijete!"

Nedostaje završna zagrada na kraju, pa umjesto retka "Hello, World!" program će vratiti grešku:

Uncaught SyntaxError: nedostaje) nakon popisa argumenata

Kako bi se skripta nastavila izvoditi, morate dodati zagradu za zatvaranje. Ovako pogreška u JavaScript sintaksi može utjecati na rad programa.

Neki aspekti JavaScript sintakse i oblikovanja dolaze iz različitih perspektiva. Jednostavno rečeno, postoje stilska pravila i varijacije koje su izborne i ne uzrokuju pogreške prilikom pokretanja koda. Međutim, postoje i mnoge općenite konvencije koje je mudro pratiti kako bi razvijači projekata i kodova bili svjesni ažuriranja stila i sintakse. Slijeđenje uobičajenih konvencija poboljšat će čitljivost vašeg koda.

Razmotrite sljedeće tri opcije za dodjeljivanje vrijednosti varijabli:

const pozdrav="Zdravo"; // nema razmaka između varijable i niza
const pozdrav = "Zdravo"; //pretjeran razmak nakon dodjele
const pozdrav = "Zdravo"; // jedan razmak između varijable i niza

Sva tri retka iznad radit će isto. Ali treća opcija (pozdrav = "Zdravo") daleko je najčešće korišten i čitljiv način pisanja koda, posebno kada se promatra u kontekstu većeg programa.

Vrlo je važno pratiti cjelovitost i dosljednost cjelokupnog programskog koda.

U nastavku ćemo pogledati nekoliko primjera kako bismo se upoznali sa sintaksom i strukturom JavaScript koda.

Znakovi razmaka

JavaScript znakovi razmaka su razmaci, tabulatori i novi redovi (ova radnja se izvodi tipkom Enter). Kao što je ranije prikazano, JavaScript tumač zanemaruje višak razmaka izvan retka, razmak između operatora i druge znakove. To znači da će sljedeća tri primjera dodjele varijabli imati isti rezultat:

const userLocation = "New York City, " + "NY";
const userLocation="New York City, "+"NY";
const userLocation = "New York City, " + "NY";

Varijabla userLocation imat će vrijednost "New York City, NY" bez obzira na stil dodjele za tu vrijednost. Za JavaScript nije bitno koji znakovi razmaka su korišteni.

Postoji jedno isprobano i istinito pravilo u pisanju programa: kada koristite razmak, slijedite ista pravila koja koristite u matematici ili gramatici. Na primjer, linija:

lakši za čitanje nego:

Važna iznimka od ovog pravila je dodjela višestrukih varijabli. Obratite pažnju na poziciju = u sljedećem primjeru:

const naziv tvrtke = "Moja tvrtka";
const companyHeadquarters = "New York City";
const companyHandle = "moja tvrtka";

Svi operatori dodjele (=) poredani su u jedan red pomoću razmaka. Ovu vrstu strukture ne koriste sve baze kodova, ali može poboljšati čitljivost.

Dodatni prijelomi redaka također se zanemaruju u JavaScriptu. U pravilu, dodatni prazne linije umeću se iznad komentara i iza bloka koda.

Okrugle zagrade

Ključne riječi kao što su if, switch i for obično imaju razmake prije i iza zagrada. Razmotrite sljedeći primjer:

// Primjer sintakse naredbe if
ako () ( )
// Provjerite matematičku jednadžbu i ispišite niz na konzolu
ako (4< 5) {
console.log("4 je manje od 5.");
}
// Primjer sintakse for petlje
za () ( )
// Ponavljanje 10 puta, ispisivanje svakog broja ponavljanja na konzolu
za (neka je i = 0; i 0) (
kvadrat (broj);
}

Budite oprezni jer svi kodovi u vitičastim zagradama ne zahtijevaju točku i zarez. Objekti se nalaze u vitičastim zagradama i moraju završavati točkom i zarezom.

// Primjer objekta
const ime objekta = ();
// Inicijaliziraj objekt trokut
const trokut = (
tip: "desno",
kut: 90,
strane: 3,
};

Uobičajena je praksa staviti točku-zarez iza svake JavaScript naredbe i izraza osim onih koji završavaju vitičastim zagradama.

Strukturiranje koda

Tehnički, sav kod u JavaScript programu može se staviti u jedan redak. Ali takav kod je vrlo teško čitati i održavati. Stoga je program podijeljen u linije.

Na primjer, naredba if/else može se napisati u jednom retku ili se može podijeliti:

// Uvjetna izjava napisana u jednom retku
if (x === 1) ( /* izvrši kod ako je istina */ ) else ( /* izvrši kod ako je laž */ )
// Uvjetni iskaz s uvlačenjem
ako (x === 1) (
// izvrši kod ako je istinito
) inače (
// izvrši kod ako je false
}

Imajte na umu: svaki kod uključen u blok je uvučen. Možete se uvući koristeći dva razmaka, četiri razmaka ili tabulatore. Izbor metode uvlačenja ovisi isključivo o osobnim preferencijama ili preporukama vaše organizacije.

Otvorena zagrada na kraju prvog retka uobičajen je način strukturiranja JavaScript izjava i objekata. Ponekad se zagrade stavljaju u zasebne retke:

// Uvjetna naredba s vitičastim zagradama u novim recima
ako (x === 1)
{
// izvrši kod ako je istinito
}
drugo
{
// izvrši kod ako je false
}

Ova struktura se rijetko koristi u JavaScriptu, kao iu drugim jezicima.

Ugniježđene izjave moraju biti odvojene:

// Inicijaliziranje funkcije
funkcija je JednakoJedan(x) (
// Provjerite je li x jednako jedan
ako (x === 1) (
// nakon uspjeha vrati istinito
vratiti istinito;
) inače (
vratiti lažno;
}
}

Pravilno uvlačenje čini kôd čitljivim. Jedina iznimka od ovog pravila koju treba imati na umu jest da komprimirane biblioteke uklanjaju sve nepotrebne simbole kako bi se smanjila veličina datoteke.

Identifikatori

Imena varijabli, funkcija ili svojstava u JavaScriptu nazivaju se identifikatorima. Identifikatori se sastoje od slova i brojeva, ali ne mogu sadržavati znakove izvan $ i _ i ne mogu započeti brojem.

Osjetljivost velikih i malih slova

Imena su osjetljiva na velika i mala slova. To jest, myVariable i myVariable će se tretirati kao dvije različite varijable.

var moja varijabla = 1;
var moja varijabla = 2;

Prema općoj konvenciji, imena se pišu velikim slovom: prva riječ se piše malim slovom, ali svaka sljedeća riječ počinje velikim slovom. Globalne varijable ili konstante pišu se velikim slovima i odvajaju podvlakom.

const STOPA_OSIGURANJA = 0,4;

Izuzetak od ovog pravila su nazivi klasa, gdje svaka riječ obično počinje velikim slovom (PascalCase).

// Inicijaliziraj klasu
klasa PrimjerKlasa (
konstruktor()
}

Kako biste osigurali čitljivost koda, morate koristiti identifikatore dosljedno u svim programskim datotekama.

Rezervirane ključne riječi

Identifikatori također ne smiju sadržavati nikakve rezervirane ključne riječi. Ključne riječi su JavaScript riječi koje imaju ugrađenu funkciju. To uključuje var, if, for i this.

Na primjer, ne možete dodijeliti vrijednost varijabli pod nazivom var.

var var = "Neka vrijednost";

JavaScript poznaje ključnu riječ var, pa će izbaciti pogrešku:

SyntaxError: Neočekivani token (1:4)