Bevezetés
A JavaScript egy magas szintű, dinamikus, prototípus-alapú programozási nyelv, amelyet elsősorban weboldalak interaktívvá tételére használunk. A böngészők beépített JavaScript-motorja futtatja a kódot, így nincs szükség külön fordítóprogramra. Modern böngészők JIT (Just-In-Time) fordítást alkalmaznak, ami gyorsabb végrehajtást biztosít.
Fontos megkülönböztetés: a Java és JavaScript két teljesen különböző nyelv. A hasonlóság csak a szintaxisban és a nevükben van.
Mire jó a JavaScript?
- Űrlapok adatellenőrzése (pl. email formátum).
- Interaktív elemek: gombok, animációk, menük.
- Dinamikus tartalom: felugró ablakok, értesítések.
- Kommunikáció a szerverrel (AJAX, Fetch API).
Mire nem jó?
Többszálúság alapból nincs, de Web Workers segítségével megoldható.
Közvetlen fájlkezelés biztonsági okokból korlátozott.
Szintaktika
A JS figyelmen kívül hagyja a szóközöket, tabokat, üres sorokat. A pontosvessző használata egyszerű utasítások esetén a sorok végén nem kötelező, de ebben az esetben új sorba kell írni az újabb utasításokat.
A JS érzékeny a kis és nagybetűkre, tehát ugyanúgy kell használni mindenhol a programban az adott változó/függvény nevét! Tehát a Kutya és a kutya két külön változó lenne…
Megjegyzések használata: // vagy /* komment szövege */
Figyelmeztetés, hogy az adott böngésző nem támogatja a javascriptet:
<noscript>
Sorry...JavaScript is needed to go ahead.
</noscript>
JavaScript elhelyezése egy weboldalon
JavaSript az oldal fejlécében.
A fejlécben, a weblap <head>…</head> közötti részébe kerül, <script> és </script> tag-ek közé. Létrehoztam egy függvényt, sayHello néven. Ezt a függvényt egy gombbal fogjuk meghívni, amelynek az onclick funkcióját használjuk ebben a példában. Használhatnánk úgy is, hogy sayHello()
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<html> <head> <script> function sayHello() { alert("Hello World") } </script> </head> <body> <input type = "button" onclick = "sayHello()" value = "Say Hello" /> </body> </html> |
JavaScript a dokumentum törzsében:
JavaScript lehet egyszerre a fejlécben és a tözsben is, sőt külső fájlban is, csak hogy ne legyen annyira egyszerű. A korábbi két példát vegyítettem egy oldalba. A fejlécben maradt a sayHello függvény, amit gombnyomásra futtatunk le, a törzsben pedig egy sima szöveget iratok ki. A document.write a példa kedvéért szerepel, mára már elavult és kerülendő. Helyette a DOM műveleteket használjuk, ezekről később lesz szó.
|
1 2 3 4 5 6 7 8 |
<body> <script> document.write("Hello World"); let nev = "Viktor"; console.log(`Hello, ${nev}!`); </script> <p>Ez egy sima szöveg a bekezdésben.</p> </body> |
JavaScript külső fájlban
A JS-t elhelyezhetjük külső fájlban is, mert sokkal egyszerűbb így több oldalon is felhasználni. Elkészítjük például a menüt, animációt és minden oldalról meg tudjuk hívni. Célszerű azonos mappába tenni a html fájllal!
|
1 2 3 4 5 6 7 8 |
<html> <head> <script src="filename.js"></script> </head> <body> ....... </body> </html> |
pelda.js Ez a fájl csak ilyen rövid:
function sayHello() {
alert("Hello World")
}
A változók lehetnek helyi és globális változók. Globális változót az egész programban tudjuk használni, helyi változót csak az adott függvénynél.Tehát a példában a valtozo1 globális változó, a valtozo2 csak a függvényen belül érhető el.