Što je JavaSkripta? Uvod s primjerom Hello Worlda

Što je JavaSkripta?

JavaSkripta je programski jezik visoke razine koji web stranicama dodaje ponašanje. To je jedna od tri osnovne tehnologije weba: HTML osigurava strukturu, CSS osigurava izgled, a JavaSkripta omogućuje interakciju. Svaki put kada okvir za pretraživanje prikazuje prijedloge dok tipkate, rotirajući izbornik fotografija se pomiče ili vas obrazac za prijavu upozori na polje koje nedostaje, JavaSkripta taj posao obavlja u pozadini.

Donji dijagram prikazuje kako se skripta nalazi uz oznake obične web stranice.

Većim dijelom svog života JavaSkripta je opisana kao skriptni jezik na strani klijenta jer se izvršavala samo unutar preglednika. Taj opis je sada nepotpun. Otkad se Node.js pojavio 2009. godine, isti jezik je također pokretao web poslužitelje, uslužne programe naredbenog retka, desktop aplikacije i mobilne aplikacije. Točniji opis danas je da JavaSkripta je jezik opće namjene s neobično snažnom prisutnošću u pregledniku.

Karakteristike koje definiraju jezik su:

• Dinamički tipizirano: Varijabla može sada sadržavati broj, a trenutak kasnije niz znakova, pa se tipovi provjeravaju dok se program izvršava.
• Interpretirano i sastavljeno na vrijeme: Engine-i poput V8 u Chromeu i Node.js-a kompajliraju često izvršavani kod u strojni kod radi brzine.
• Višestruka paradigma: Podržani su imperativni, funkcionalni i objektno orijentirani stilovi.
• Vođeno događajima: kod reagira na klikove, pritiske tipki, tajmere i mrežne odgovore umjesto da se pokreće od vrha do dna i zaustavlja seping.
• Jednonitna s petljom događaja: Spori rad, poput mrežnog poziva, stavlja se u red čekanja umjesto zamrzavanja stranice.

Povijest od JavaScript

Brendan Eich je stvorio JavaScenarij u Netscape Communicationsu 1995. godine, proizvevši prvi radni prototip za otprilike deset dana. Interno se projekt zvao MokaIsporučen je u beta verziji Netscape Navigatora 2.0 kao LiveScript u rujnu 1995., a preimenovan je JavaScript u prosincu 1995. kao dio marketinškog sporazuma između Netscapea i Sun Microsystemsa, tvrtke koja je bila vlasnik Java u to vrijeme.

To preimenovanje je jedini razlog zašto toliko početnika još uvijek pretpostavlja JavaScript je lagano izdanje JavaDva jezika nisu povezana po dizajnu, vlasništvu i vremenu izvođenja. Netscape je predao jezik Ecma Internationalu 1996. godine, a prvo izdanje standarda ECMA-262 objavljeno je u lipnju 1997. Tablica u nastavku navodi prekretnice koje su najvažnije pri čitanju starijeg koda.

Zbog godišnjeg ciklusa izdavanja, kod napisan prije 2015. izgleda znatno drugačije od modernog koda. Stariji tutorijali koriste var svugdje, dok trenutni kod preferira let i const kada deklariranje varijabli u JavaScript.

Što je JavaZa koji se scenarij koristi?

JavaSkripta više nije ograničena na male trikove na stranicama. Ista sintaksa sada se pojavljuje na četiri vrlo različita mjesta, zbog čega se dosljedno rangira kao jedan od najčešće korištenih jezika u anketama programera.

Igre, vizualizacije podataka, proširenja preglednika i mali hardverski projekti također se oslanjaju na njega. Za početnika praktična posljedica je jednostavna: trud koji uložite u sintaksu sada se izravno prenosi na rad na poslužitelju, mobilni rad i kasnije automatizaciju testiranja. Ako želite vidjeti jezik primijenjen na stvarne probleme, prođite kroz skup praktičan JavaPrimjeri skriptnog koda nakon što su osnove udobne.

Kako trčati JavaSkripta?

JavaSkripta se ne izvršava sama od sebe. Potrebno joj je okruženje hosta koje sadrži JavaScript motorChrome i Edge koriste V8, Firefox koristi SpiderMonkey, a Safari koristi JavaScriptCore. Kada preglednik preuzme HTML stranicu i pronađe skriptu, predaje tu skriptu svom engineu, koji je parsira, kompajlira i pokreće.

Drugo host okruženje je Node.js, koje ugrađuje isti V8 engine izvan preglednika. Tako se identičan jezik izvodi na poslužitelju ili u terminalu. Praktična prednost JavaSkripta je to svaki moderni preglednik ga podržava on Windows, Linux i macOS, tako da se rijetko morate brinuti o tome koji preglednik posjetitelj koristi. Ovo je pravo poboljšanje u odnosu na VBScript, koji je ikada radio samo u Internet Exploreru na Windows i sada je zastario zajedno sa samim Internet Explorerom.

Alati koji vam trebaju

Trebat će vam uređivač teksta za pisanje koda i preglednik za pregled rezultata. Notepad++, Visual Studio Code, Sublime Text, i bilo koji drugi editor s kojim se osjećate ugodno obavit će posao, iako će vam editor s isticanjem sintakse i usklađivanjem zagrada uštedjeti mnogo otklanjanja pogrešaka. Radi bilo koji trenutni preglednik: Google Chrome, Firefox, Microsoft Edgeili Safari. Osim te dvije stavke, ništa ne treba kupiti ili instalirati.

Jednostavan JavaProgram za skripte

Ako zadržite JavaSkripta unutar samog HTML dokumenta, cijeli kod mora se nalaziti između otvarajućeg znaka <script> oznaka i zatvaranje </script> oznaku. Na taj način preglednik razlikuje vaš kod od okolnog koda. Starije stranice također postavljaju type atribut, napisan kao <script type="text/javascript">, što je bilo potrebno kada su postojali konkurentski klijentski jezici poput VBScripta. Moderne stranice ga izostavljaju jer HTML5 tretira text/javascript kao zadano. Dvije verzije u nastavku su funkcionalno identične i obje su još uvijek važeće.

Hello World Primjer

Tradicionalni prvi program prikazuje poruku. Stavite sljedeći kod u datoteku pod nazivom hello.html i otvorite ga u pregledniku.

<html>
<head>
	<title>My First JavaScript code!!!</title>
	<script type="text/javascript">
		alert("Hello World!");
	</script>
</head>
<body>
</body>
</html>

Izlaz:

A browser dialog box opens containing the text:

Hello World!

Bilješka: type="text/javascript" nije potreban u HTML5. Sljedeći kod radi na potpuno isti način.

<html>
<head>
	<title>My First JavaScript code!!!</title>
	<script>
		alert("Hello World!");
	</script>
</head>
<body>
</body>
</html>

Izlaz:

A browser dialog box opens containing the text:

Hello World!

Nakon što stranica naraste više od nekoliko redaka, premještanje skripte u vlastitu .js Datoteka održava čitljivost oznaka i omogućuje pregledniku da kešira kod. Razlike su detaljno obrađene u ovoj usporedbi unutarnje i vanjsko JavaScript.

Kako napisati i pokrenuti svoj prvi skript

Postoje tri praktična načina za izvršenje JavaSkripta, a početnik bi trebao isprobati sva tri jer svaki odgovara drugačijoj situaciji.

1. Konzola preglednika. Ovo je najbrža opcija i ne zahtijeva nikakve datoteke. Otvorite bilo koju web stranicu, pritisnite F12 (ili Ctrl+Shift+Ja uključen Windows i Linux, Cmd+Option+I na macOS) i odaberite Utješiti Tab. Upišite redak, pritisnite Enter i rezultat će se odmah pojaviti. To je idealno mjesto za testiranje jednog izraza ili za provjeru što funkcija vraća.

// Type each line into the browser console and press Enter
console.log(2 + 2);
console.log("Guru" + 99);
console.log(Math.max(4, 12, 7));
console.log(typeof "hello");

Izlaz:

4
Guru99
12
string

Obratite pažnju na drugi redak. Dodavanje broja 99 nizu "Guru" proizvodi niz "Guru99” umjesto greške, jer JavaSkripta automatski pretvara broj u tekst. To ponašanje je praktično i ujedno je klasičan izvor početničkih grešaka.

2. HTML datoteka. Ovo je primjer Hello World prikazan gore. Koristite ga kad god kod mora dodirnuti samu stranicu, na primjer za čitanje vrijednosti obrasca ili promjenu elementa.

3. Node.js iz terminala. Instalirajte Node.js, spremite kod u datoteku s nastavkom .js proširenje, a zatim pokrenite node first-script.jsNišta se ne renderira, pa console.log postaje vaš izlazni kanal. Ovo je put kojim treba ići kada želite vježbati značajke čistog jezika bez ikakvog HTML-a oko njih.

// first-script.js
const language = "JavaScript";
const createdBy = "Brendan Eich";
const releaseYear = 1995;

console.log(language + " was created by " + createdBy + " in " + releaseYear + ".");

const usedFor = ["Interactive web pages", "Server apps with Node.js", "Mobile apps"];

usedFor.forEach(function (item, index) {
  console.log(index + 1 + ". " + item);
});

Izlaz:

JavaScript was created by Brendan Eich in 1995.
1. Interactive web pages
2. Server apps with Node.js
3. Mobile apps

Ovaj kratki skript već koristi tri ideje s kojima ćete se stalno susresti: konstante deklarirane s const, poredak sadrži popis vrijednosti i funkciju povratnog poziva koja se prosljeđuje forEachPrepisivanje iste petlje s for izjava je korisna vježba nakon što ste proučili petlje u JavaScript.

JavaSkripta vs. Java

Imena su najveća nesreća u povijesti programiranja, a zbrku koju uzrokuju vrijedi razjasniti na vrijeme. JavaScript je preimenovan iz LiveScript isključivo iz marketinških razloga 1995. godine, u trenutku kada Java bila je najrazgovaranija tehnologija na webu. Ta dva jezika dizajnirali su različiti ljudi, u različitim tvrtkama, za različite probleme.

Jedina prava sličnost je u tome što oba posuđuju sintaksu vitičastih zagrada iz C-a. Učenje jednog ne uči vas drugom, iako zajednička sintaksa čini drugi jezik malo lakšim za čitanje. Ako je strogo typing apelira na tebe, TypeScript dodaje statički sloj tipa na vrh JavaSkripta prilikom kompajliranja u običnu verziju JavaScenarij, a razlike su navedene u ovome TypeScript i JavaUsporedba skripti.

S osnovama na mjestu, prirodni sljedeći koraci su interaktivan JavaVježbe sa skriptama, A zatim varijable i tipovi podataka, Nakon čega slijedi nizovi i petlje. Nakon toga, objektno orijentirano JavaScript objašnjava kako se objekti, prototipovi i klase međusobno uklapaju i formatiranje nizova pokriva rukovanje tekstom koje ćete koristiti u gotovo svakoj skripti.

Pitanja i odgovori