Ugrás a tartalomhoz

JavaScript

Ellenőrzött
A Wikipédiából, a szabad enciklopédiából
JavaScript
Image
ParadigmaMulti-paradigma: szkript, objektumorientált (prototípus-alapú), imperatív, funkcionális
Jellemző kiterjesztés.js
Megjelent1995. december 4.
TervezőBrendan Eich
FejlesztőNetscape Communications Corporation, Mozilla Alapítvány
Utolsó kiadás
  • ECMAScript 2024 (stabil verzió, 2024. június, 15th edition, ES2024, ES15)[1]
  • ECMAScript 2025 (kiadás előtti verzió, 2024. március 27., ES2025)[2]
Típusosságdinamikus, duck
MegvalósításokKJS, Rhino, SpiderMonkey, V8, Carakan, Chakra
Hatással volt ráScheme, Self, Java, C, Python, AWK, HyperTalk
Befolyásolt nyelvekActionScript, AtScript, CoffeeScript, Dart, JScript .NET, Objective-J, QML, TypeScript, Node.js, LiveScript
Weboldal


A JavaScript programozási nyelv egy objektumorientált, prototípus-alapú szkriptnyelv, amelyet weboldalakon elterjedten használnak. Ebből fejlődött ki a TypeScript, ami a JavaScript típusos változatának tekinthető.

Története

[szerkesztés]
Image
 Ez a lap vagy szakasz tartalmában elavult, korszerűtlen, frissítésre szorul.
Frissítsd időszerű tartalommal, munkád végeztével pedig távolítsd el ezt a sablont!
Image

Elkészülése a Netscape-nél

[szerkesztés]

Eredetileg Brendan Eich, a Netscape Communications mérnöke fejlesztette ki; neve először Mocha, majd LiveScript volt, később „JavaScript” nevet kapott, és szintaxisa közelebb került a Sun Microsystems Java programozási nyelvéhez. A JavaScriptet először 1997–99 között szabványosította az ECMA „ECMAScript” néven. A jelenleg is érvényes szabvány az ECMA-262 Edition 3 (1999. december), ami a JavaScript 1.5-nek felel meg. Ez a szabvány egyben ISO szabvány is.

A Microsoft általi átvétele

[szerkesztés]

A Microsoft 1995-ben kifejlesztette az Internet Explorert, ami a Netscape-pel való böngészőháborúhoz vezetett. A Microsoft a Netscape Navigator JavaScript-feldolgozójának forráskódja segítségével létrehozta a sajátját, a JScriptet.

A JScript először 1996-ban jelent meg a CSS kezdeti támogatása és a HTML néhány kiegészítése mellett. E megvalósítások merőben különböztek a Navigatorban alkalmazottaktól,[3][4] ami megnehezítette a fejlesztőknek, hogy a weblapjaik mindkét webböngészőben jól működjenek, és ami a „Netscape-en működik legjobban” és „Internet Exploreren működik legjobban” széles körű használatához vezetett sok éven át.[3][5]

A JScript felemelkedése

[szerkesztés]

1996 novemberében a Netscape elküldte a JavaScriptet az ECMA International-nek, ami a sztenderddé válás kiindulópontja. Ez vezetett 1997 júniusában az első ECMAScript nyelv hivatalos kiadásához.

A sztenderdizációs folyamat néhány évig folytatódott, közben az ECMAScript 2 1998 júniusában, az ECMAScript 3 1999 decemberében lett kiadva. Az ECMAScript 4-en a munka 2000 decemberében kezdődött.

Közben a Microsoft egyre dominánsabb lett a böngészőpiacon. A 2000-es évek elejére az Internet Explorer részesedése elérte a 95%-ot.[6] Ez azt jelenti, hogy a JScript tulajdonképp sztenderddé vált a weben.

A Microsoft eleinte részt vett a sztenderdizációban, s néhány tervezetet is megvalósított, de végül megszűnt közreműködni.

ECMAScript 5

[szerkesztés]
ImageEz a szakasz egyelőre üres vagy erősen hiányos. Segíts te is a kibővítésében!

Éves frissítések

[szerkesztés]
ImageEz a szakasz egyelőre üres vagy erősen hiányos. Segíts te is a kibővítésében!

Szerkesztés, előállítás

[szerkesztés]

A JavaScript kód vagy a HTML fájlban, vagy külön (jellemzően .js kiterjesztésű) szövegfájlban van. Ezek a fájlok tetszőleges szövegszerkesztő (nem dokumentumszerkesztő) programmal szerkeszthetőek.

Futási környezete

[szerkesztés]

A JavaScript esetében a futási környezet jellemzően egy webböngésző, illetve annak JavaScript-motorja.

JavaScript alkalmazások futtathatók továbbá a böngészőn kívül is, Node.js vagy Deno segítségével, melyek Windows, macOS és Linux alapú operációs rendszerekkel is kompatibilisek.

JavaScript programok Windows alapú környezetben futtathatók továbbá a wscript.exe és a cscript.exe segítségével is.

Inkompatibilitások

[szerkesztés]

Bár a nyelvet szabványosították, mégis részben különbözően implementálják a JavaScriptet a különböző böngészők.

Adattípusok

[szerkesztés]

Alaptípusok:[7]

  • Elemi típusok:
    • boolean (logikai érték, értéke igaz vagy hamis)
    • null (érték hiányát jelzi)
    • undefined (egy meghatározatlan érték)
    • number (szám, lehet egész és lebegőpontos is). Léteznek különleges értékek is, mint a NaN (Not a Number, azaz: Nem szám) érték, amit akkor használ a nyelv, ha értelmezhetetlen a matematikai művelet eredménye, például 0/0. Lehet még pozitív, vagy negatív végtelen, vagy szintén pozitív/negatív 0 érték. A JavaScript különbséget tesz a két 0 között.
    • BigInt (tetszőleges pontosságú egész szám)
    • string (karakterlánc)
    • symbol (egy olyan speciális típus, aminek két példánya soha nem egyenlő)
  • object (objektum, minden összetett típus ebbe tartozik)

Szintaxis

[szerkesztés]

Az undefined és a symbol kivételével minden elemi típusnak, valamint néhány objektumtípusnak van saját szintaxisa:

  • Elemi típusok:
    • boolean: a két lehetséges értéke true és false.
    • null: az egyetlen lehetséges értéke null.
    • Egész number, BigInt: decimális (pl. 28), oktális (pl. 034 vagy 0o34 – BigIntnél nem hagyható el az o), hexadecimális (pl. 0x1c) vagy bináris (pl. 0b11100) szám, BigInt esetében n utótaggal (pl. 9007199254740992n vagy 0x20000000000000n). A számrendszert jelző o, x, illetve b, valamint a hexadecimális számok 9-nél a–f számjegyei lehetnek kis- és nagybetűsek is, a BigIntek n utótagja viszont mindig kisbetűs.
    • Törtrésszel is rendelkező number: decimális szám, a tizedes elválasztó a pont, írható normálalakhoz hasonló formában (de a normálalaktól eltérően a mantisszának nem kell 1 és 10 közötti abszolút értékűnek lennie), pl. 3.14 vagy 6e23.
    • string: lásd lentebb.
  • Objektumtípusok:
    • Object (általános objektum): { név1: érték1, név2: érték }, pl. { név: 'Wikipédia', mottó: 'A szabad enciklopédia' }.
    • Array (tömb, több különböző adattípust is tartalmazhat): [ elem1, elem2 ], pl. [ 'pi', 3.14 ].
    • RegExp (reguláris kifejezés): /regex/.
    • Function (függvény – a függvények is változónak számítanak): pl. function f(x) { return 2*x; } vagy (x) => 2*x.

Az elemi típusok közül az undefined az undefineddal érhető el, ez azonban a nulltól eltérően nem kulcsszó, hanem a globális névtér egy változója,[8] symbol típusú értékek pedig a Symbol() globális névtérbeli függvénnyel hozhatók létre.[9]

String

[szerkesztés]

A string típusú adatokat aposztróf ('…'), idézőjel ("…") vagy backtick (`…`) pár közé írjuk. Az első két megoldás teljesen azonos jelentésű, így az éppen nem használt jeleket is tartalmazhatja a szöveg. 

const a = "Hymnus, a' Magyar nép zivataros századaiból";
const b = 'Idézőjel: (")';
const c = " \" ' ";

ami egyszerűbben:

const a="Hymnus, a' Magyar nép zivataros századaiból", b='Idézőjel: "', c="\"'";

Az első példában az aposztróf, a másodikban az idézőjel tagja a string adatnak, míg a harmadik példában mind a kettő. A harmadik példában a backslash karakter miatt nincs speciális jelentése az idézőjelnek.

A backtick (`…`) egy sablonstring, ami a normál (aposztrófos vagy idézőjeles) stringektől eltérően tartalmazhat sortöréseket, beágyazhat tetszőleges JavaScript-kifejezéseket, valamint speciális függvények teljesen más jelentést is adhatnak neki.[10] Példák sablonstringekre:

const a = `Kedvenc könyvem a(z) ${kedvenc.cím}, amit ${kedvenc.szerző} írt.`;
const html = `<!DOCTYPE html>
<html>
    <head>
        <title>Weblap</title>
    </head>
    <body>
        <p>Helló világ!</p>
    </body>
</html>`;
const feldolgozott = feldolgozó`Paraméter, ami tartalmazhat ${a} és ${html} változókat is`;

Változók

[szerkesztés]

A JavaScript nyelvben minden változót előzetesen deklarálni kell. Ezt függvényszinten a var, blokkszinten a let vagy a const kulcsszóval tudjuk megtenni. Utóbbi használata esetén a változónak nem lehet újból értéket adni (de ha a változó objektumtípusú, akkor az objektum értéke módosítható).[11] Az ECMAScript 6 változat előtt csak a var létezett,[12] azóta a let használata javasolt. Lehet csoportos deklaráció is, amikor vesszővel elválasztva több változót megadunk, és akár értéket is rendelhetünk hozzájuk.

Globális

[szerkesztés]

A var kulcsszóval deklarált változók az egész függvényben elérhetőek, amelyikben deklarálva lettek (ha függvényen kívül lettek deklarálva, akkor bárhol elérhetők), még a deklaráció előtt is. Használatuk mellőzendő, mivel könnyen okozhatnak nehezen felderíthető hibákat.

Lokális

[szerkesztés]

Deklarálásuk a let vagy const kulcsszóval történik. Csak a változók deklarálásának helyén, az adott blokkban láthatóak. A blokk kezdete és a deklaráció között nem használhatóak, de elfedik az esetleges azonos nevű, külsőbb blokkban deklarált változót.[12]

Változók deklarálása

[szerkesztés]
//Globális változók
var str;
var int1, int2, int3;
var a = [], b, c = d = 0;
var i = 1;
var j = null;

//Lokális változók
let str = "Lorem ipsum";
let str1, str2, str3;
let wheels = 2;
let myObject = {};
let myArr = [0, 1, 2, 3];
let isUsed = undefined;
const height = 6;
height = 7; // HIBA: a height értéke nem módosítható
const üres; // HIBA: constnál kötelező a kezdeti értékadás

A fentiekben többféle deklarációra látunk példát. Fontos megjegyeznünk, hogy értékadás nélkül a változó típusa undefined lesz (kivéve a consttal deklarált változókat, amiknek hiba nem adni értéket). Az ötödik esetben pedig a j változó null értéket kap. A különbség a két fogalom között az, hogy a null úgy viselkedik, mint egy 0 szám érték, a definiálatlan típus pedig egy speciális érték: NaN (Not a Number). A két érték összehasonlítása egyenlőséget mutat minden esetben.

Látható, hogy a deklarációt lehet vegyesen is használni: a egy üres tömb (Array), b értéke undefined, c és d pedig 0.

Arra is van lehetőség, hogy a deklaráló kulcsszót elhagyjuk, viszont ilyenkor az értékadás kötelező, és a változó globálisan elérhető lesz.

A JavaScript nyelv case-sensitive, ami annyit tesz, hogy nem mindegy, hogy kis- vagy nagybetűt használunk. Figyeljünk erre oda, főként ha ezen tekintetben eltérő szabályú keretbe helyezzük a JavaScript kódrészletet, például ASP-be!

Operátorok

[szerkesztés]

Az operátorok típusai

[szerkesztés]

Aritmetikai operátorok

[szerkesztés]

Összeadás (+)

Az összeadás kétoperandusú művelet. Számokat ad össze, 

z=3+4;   // z egyenlő 7-tel

és karakterfüzéreket láncol össze. 

z="3"+"4";         //z egyenlő "34"-gyel
udv="Hel"+"lo";   // az udv megegyezik a "Hello"-val

Kivonás (-)

Ha kétoperandusú műveletként használjuk, akkor a kivonás (-) művelettel két számot vonhatunk ki egymásból. 

x=4-3;   // x egyenlő 1-gyel
x=3-4;   // x egyenlő -1-gyel

Ha egyoperandusú műveletként használjuk, akkor ez az operátor az értéket az ellentettjére alakítja. 

x=6;
y=-x;    // y egyenlő -6-tal
z=-y;    // z jelen esetben megegyezik 6-tal

Ha az operátort nem szám típusú értékekkel használjuk, akkor megpróbálja kiszámolni a különbséget olyan módon, hogy szám típusú értékké alakítja őket.

Szorzás (*)

A szorzás (*) kétoperandusú művelet, amelynek segítségével két számot szorozhatunk össze. 

z=2*3;   // z egyenlő 6-tal

Ha az operátort nem szám típusú értékekkel használjuk, akkor megpróbálja kiszámolni a szorzatot olyan módon, hogy szám típusú értékké alakítja őket.

Osztás (/)

Az osztás (/) olyan kétoperandusú művelet, amely az első operandust elosztja a másodikkal. 

z=6/3;   // z egyenlő 2-vel
z=3/2;   // z egyenlő 1.5-del

A nullával való osztás speciális értéket eredményez. 

z=3/0;   // z POSITIVE_INFINITY-vel egyenlő
z=-3/0;  // z NEGATIVE_INFINITY-vel egyenlő
z=0/0;   // z NaN-nal egyenlő

Ha ez operátort nem szám típusú értékekkel használjuk, akkor megpróbálja kiszámolni a hányadost olyan módon, hogy szám típusú értékké alakítja őket.

Maradékos osztás (%)

A maradékos osztást (%) szokás modulo-műveletnek is nevezni. A két operandus osztása során keletkezett maradékot adja vissza. 

z=7%2;   // z egyenlő 1-gyel
z=6%2;   // z egyenlő 0-val

Ha az operátort nem szám típusú értékekkel használjuk, akkor megpróbálja kiszámolni a maradékot olyan módon, hogy szám típusú értékké alakítja őket.

Inkrementálás (++)

Az inkrementálás (++) egyoperandusú művelet, amelynek segítségével egy számot lehet inkrementálni, azaz hozzá adni egyet. A művelet lehet pre- és posztinkrement. A preinkrement azelőtt végrehajtódik, mielőtt az utasítás további műveletei végrehajtódnának. 

x=5;
y=++x;   // mind az x, mind az y egyenlő 6-tal

A posztinkrement azután hajtódik végre, miután az utasítás összes többi művelete végrehajtódott. 

x=5;
y=x++;   // az x 6-tal, az y 5-tel egyenlő

Ha az operátort nem szám típusú értékekkel használjuk, akkor az inkrementálást megpróbálja kiszámolni olyan módon, hogy szám típusú értékké alakítja az operandusokat.

Dekrementálás (--)

A dekrementálás (--) egyoperandusú művelet, amelynek segítségével egy számot lehet dekrementálni, azaz értékéből egyet kivonni. A művelet lehet pre- és posztdekrement.

A predekrement azelőtt végrehajtódik, mielőtt az utasítás további műveletei végrehajtódnának. 

x=5;
y=--x;   // mind az x, mind az y egyenlő 4-gyel

A posztdekrement azután hajtódik végre, miután az utasítás összes többi művelete végrehajtódott. 

x=5;
y=x--;   // az x 4-gyel, az y 5-tel egyenlő

Ha az operátort nem szám típusú értékekkel használjuk, akkor az dekrementálást megpróbálja kiszámolni olyan módon, hogy szám típusú értékké alakítja az operandusokat.

Logikai operátorok

[szerkesztés]
  • logikai és: a && b
  • logikai vagy: a || b
  • tagadás/negálás: !a
  • kisebb mint: <
  • nagyobb mint: >
  • kisebb egyenlő: <=
  • nagyobb egyenlő: >=
  • egyenlő: == (értékszintű összehasonlítás)
  • nem egyenlő: != (értékszintű összehasonlítás)
  • feltételes hármas: ?:
  • vessző: ,
  • teljesen egyenlő: === (érték és típus szintű összehasonlítás)
  • nem teljesen egyenlő: !== (érték és típus szintű összehasonlítás)
  • a kettős tagadás nem elemi művelet, gyakran egy érték logikai típusúvá alakítására használják (eredménye true vagy false): !!a
alert( !!"non-empty string" ); // true
alert( !!null );               // false

A különbség az egyenlő (==) és teljesen egyenlő (===) operátorok között az, hogy a fordító az egyenlőség esetén a kiértékelés előtt „kikényszeríti” a hasonlóságot, tehát például: egy numerikus és karakteres 1, ill. "1" érték összehasonlítása egyenlőséget eredményez, míg a teljes egyenlőség vizsgálatánál nem.

Az értéknövelő és -csökkentő operátor a hozzá kapcsolódó értékhez hozzáad, vagy kivon belőle egyet. 

a = ++a;
b = a++;

Ha az operátor elöl áll, akkor előbb történik meg az érték növelése, ha viszont hátul áll az operátor, akkor előbb az értékadás (b = a) valósul meg, és utána mellesleg nő az "a" változó értéke 1-gyel. Hasonlóképpen az értékcsökkentő operátornál.

A feltételes hármas (? :) operátor esetén a kérdőjel előtt egy logikai kifejezés szerepel. Ha a kiértékelés eredménye igaz, akkor a "?" és ":" közötti értéket adja vissza az operátor, ellenkező esetben a ":" utáni értéket.

A bitszintű jobbra eltolás két változata között a különbség az, hogy amíg a ">>" esetén az előjelbit értékét használja az új értékhelyek feltöltésére a bal oldalon, addig a ">>>" operátor esetén mindig 0 értékekkel tölti fel az üres helyeket. 

a = b >> 2;
b = a >>> 2;

A műveletek során a második kifejezésben megadhatjuk, hogy hány értékhellyel tolódjon el a bináris adatsor. 

x += y;
x = x + y;

String operátorok

[szerkesztés]
  • konkatenáció (összefűzés) c=a+b
  • részstring-képzés: stringobjektum.substring(kezdet,hossz)

Bitszintű műveletek

[szerkesztés]
  • bitszintű negálás: ~
  • bitszintű balra eltolás: <<
  • bitszintű jobbra eltolás: >>
  • előjel nélküli jobbra eltolás: >>>
  • bitszintű és: &
  • bitszintű kizáró vagy: ^
  • bitszintű vagy: |

Értékadó operátorok

[szerkesztés]
  • értékadás: =
  • összetett értékadás: OP= (például: a += 2; c -= 3; d /= 9; stb.)

Vegyes operátorok

[szerkesztés]
  • törlés: delete
  • típus: typeof
  • értékadás kiküszöbölése: void
  • példánya-e: instanceof
  • új: new
  • tartalmazás, benne: in

Típuskényszerítés

[szerkesztés]

A JavaScript esetében könnyű az átmenet a változó típusok között. Ha a feldolgozó kiértékel egy kifejezést, akkor az alábbi szabályok szerint jár el:

Tevékenység Eredmény
szám és szöveg összeadása A szám a szövegbe épül
logikai érték és szöveg összeadása A logikai érték a szövegbe épül
szám és logikai érték összeadása A logikai érték a számba épül

Műveletek precedenciája

[szerkesztés]

mdc operátori precedencia[13]

Operátorok asszociativitása

[szerkesztés]
ImageEz a szakasz egyelőre üres vagy erősen hiányos. Segíts te is a kibővítésében!

Kivételkezelés

[szerkesztés]
try {
.
<utasítások>
.
}
catch(e){
..
<utasítások>
..
}

A JavaScript alapobjektumai és függvényei

[szerkesztés]
Megnevezés Leírás
Array tömb objektum
Boolean logikai értékeket leíró és azok kezelését szolgáló beépített objektum
Date dátumkezelésre szolgáló beépített objektum
eval() JavaScript kód végrehajtása a paraméterként megadott karakterláncból (Biztonsági kockázatot rejtő, veszélyes függvény!)
Math matematikai függvények használatát biztosító beépített objektum
MimeType MIME típusok kezelésre szolgáló beépített objektum
Number számok megvalósítását szolgáló beépített objektum
parseFloat() a numerikus értéket képviselő objektumból kinyeri a lebegőpontos számot
parseInt() a numerikus értéket képviselő objektumból kinyeri az egész számot
RegExp reguláris kifejezések kezelésre szolgáló beépített objektum
String sztringek megvalósítását és kezelését szolgáló beépített objektum
BigInt nagy egészek tárolására alkalmas adattípus

Math.

[szerkesztés]
Kód Leirás
Math.abs(x) Visszatér a szám abszolút értékével
Math.acos(x) Visszatér a szám arkusz koszinuszával (radián)
Math.asin(x) Visszatér a szám arkusz szinuszával (radián)
Math.atan(x) Visszatér a szám arkusz tangensével (radián)
Math.cbrt(x) Visszatér a szám köbgyökével
Math.ceil(x) Visszatér a nem egész szám felfelé kerekített értékével
Math.cos(x) Visszatér a szám koszinuszával (radián)
Math.E Visszatér az 'e' számmal (kb. 2,71)
Math.floor(x) Visszatér a nem egész szám felfelé kerekített értékével
Math.LN2 Visszatér a 2 'e' alapú logaritmusával
Math.LN10 Visszatér a 10 'e' alapú logaritmusával
Math.log(x) Visszatér a szám 'e' alapú logaritmusával
Math.max(x, y, z, ...) Visszatér a legnagyobb számmal
Math.min(x, y, z,.....) Visszatér a legkisebb számmal
Math.PI Visszatér a 'pi' számmal (kb. 3,14)
Math.pow(x, y) Visszatér a szám hatványával 'x' az alap és az 'y' a kitevő
Math.random() Visszatér egy random számmal 0 és 1 között
Math.round(x) Visszatér a nem egész szám kerekített értékével
Math.sin(x) Visszatér a szám szinuszával (radián)
Math.sqrt(x) Visszatér a szám négyzetgyökével
Math.tan(x) Visszatér a szám tangensével (radián)

JavaScript események

[szerkesztés]

Az oldal egészére vonatkozó események

[szerkesztés]
Esemény Eseménykezelő Bekövetkezése
Load onLoad Az oldal minden objektuma letöltődése után
Resize onResize Dokumentum átméretezésekor
Scroll onScroll Dokumentum görgetésekor
Unload onUnload Dokumentum eltávolítása esetén ablakból vagy frame-ből. Érvényes BODY, FRAMESET elemekre.

Egéresemények

[szerkesztés]
Esemény Eseménykezelő Bekövetkezése Menete Érvényes
Click onClick Az adott elemre való egérkattintáskor MouseDown > MouseUp > Click (Többszörös kattintásnál
a detail attribútum értéke minden kattintásnál megnövekszik eggyel.)		 A legtöbb elemre.
MouseDown onMouseDown Egérgomb lenyomása az adott elem felett - A legtöbb elemre.
MouseUp onMouseUp Egérgomb felengedése az adott elem felett - A legtöbb elemre.
MouseOver onMouseOver Az egérkurzor az adott elem fölé kerülése esetén. - A legtöbb elemre.
MouseMove onMouseMove Az egérkurzor mozog az adott elem fölött. - A legtöbb elemre.
MouseOut onMouseout Az egérkurzor az adott elemet elhagyja. - A legtöbb elemre.

Formokra vonatkozó események

[szerkesztés]
  • Blur
    • Eseménykezelő neve: onBlur
    • Bekövetkezése: amikor az adott elem elveszti a "fókuszt".
    • Érvényes: LABEL, INPUT, SELECT, TEXTAREA, és BUTTON elemekre.
  • Change
    • Eseménykezelő neve: onChange
    • Bekövetkezése: amikor az adott elem elveszti a beviteli fókuszt, és változás következett be a tartalmában azóta, hogy rákerült a fókusz.
    • Érvényes: INPUT, SELECT, és TEXTAREA elemekre.
  • Focus
    • Eseménykezelő neve: onFocus
    • Bekövetkezése: amikor az adott elem aktívvá válik, vagy az egér, vagy a billentyűzet segítségével (TAB).
    • Érvényes: LABEL, INPUT, SELECT, TEXTAREA, és BUTTON elemekre.
  • Reset
    • Eseménykezelő neve: onReset
    • Bekövetkezése: amikor FORM reset következik be.
    • Érvényes: Csak FORM elemre.
  • Select
    • Eseménykezelő neve: onSelect
    • Bekövetkezése: amikor a felhasználó szöveget jelöl ki szöveges (text) mezőben.
    • Érvényes: INPUT, TEXTAREA elemekre.
  • Submit
    • Eseménykezelő neve: onSubmit
    • Bekövetkezése: amikor a FORM adatokat elküldenek. (submit).
    • Érvényes: Csak FORM elemre.

Objektumszintű események

[szerkesztés]
  • Abort
    • Eseménykezelő neve: onAbort
    • Bekövetkezése: amikor egy képletöltést megszakítanak.
    • Érvényes: objektum elemekre.
  • Error
    • Eseménykezelő neve: onError
    • Bekövetkezése: Amikor egy kép nem töltődik le teljesen vagy hiba keletkezik a script futása közben.
    • Érvényes: OBJEKTUM, BODY, FRAMESET elemekre.

JavaScript és HTML kapcsolata

[szerkesztés]

Az abszlút minimum

[szerkesztés]

JavaScript és HTML együttes használatával könnyedén készíthetők egyszerű kalkuláror-programok. Az ilyen kalkulátorok egy HTML-ben megírt űrlapon (FORM) keresztül kérik be és írják ki az adatokat (INPUT), a matematikai számításokat pedig JavaScript-ben megírt függvényekkel végezhetjük el. A megfelelő nyomógomb (BUTTON) lenyomásának hatására pedig lefut a megfelelő függvény (function).

Az alábbi egyszerű html dokumentum ezt a kapcsolatot mutatja be. minimum.html néven elmentve, és böngészővel megnyitva egy egyszerű kalkulátort kapunk:

<HTML>
<BODY>
<SCRIPT>

	function osszead(){
		document.alapmuveletek.c.value = parseInt(document.alapmuveletek.a.value) + parseInt(document.alapmuveletek.b.value);
	}

	function kivon(){
		document.alapmuveletek.c.value = parseInt(document.alapmuveletek.a.value) - parseInt(document.alapmuveletek.b.value);
	}

	function szoroz(){
		document.alapmuveletek.c.value = parseInt(document.alapmuveletek.a.value) * parseInt(document.alapmuveletek.b.value);
	}
	
	function oszt(){
		document.alapmuveletek.c.value = parseFloat(document.alapmuveletek.a.value) / parseFloat(document.alapmuveletek.b.value);
	}
</SCRIPT>
<BODY>
<FORM NAME="alapmuveletek">
b=<INPUT TYPE="TEXT" NAME="a"></INPUT><BR>
a=<INPUT TYPE="TEXT" NAME="b"></INPUT><BR>
<BUTTON TYPE="BUTTON" onclick="osszead()">a+b</BUTTON>
<BUTTON TYPE="BUTTON" onclick="kivon()">a-b</BUTTON>
<BUTTON TYPE="BUTTON" onclick="szoroz()">a*b</BUTTON>
<BUTTON TYPE="BUTTON" onclick="oszt()">a/b</BUTTON>
<BR>c=<INPUT TYPE="TEXT" NAME="c">
</BODY>
</HTML>

Az input értéke (.value) karakterlánc formátumú, amit a matematikai művelethez át kell konvertálnunk számmá. Ha egész számmá akarjuk alakítani, ezt megtehetjük a parseInt() függvénnyel. Ha tört számokkal szeretnénk dolgozni, akkor pedig a parseFloat() függvényt használhatjuk.

Jegyzetek

[szerkesztés]
  1. ↑ ECMAScript® 2024 Language Specification, 2024. június 1. (Hozzáférés: 2024. augusztus 30.)
  2. ↑ ECMAScript® 2025 Language Specification, 2024. március 27. (Hozzáférés: 2024. április 17.)
  3. ↑ a b Champeon, Steve: JavaScript, How Did We Get Here?. oreilly.com, 2001. április 6. [2016. július 19-i dátummal az eredetiből archiválva]. (Hozzáférés: 2016. július 16.)
  4. ↑ Microsoft Internet Explorer 3.0 Beta Now Available. microsoft.com. Microsoft, 1996. május 29. (Hozzáférés: 2016. július 16.)
  5. ↑ McCracken, Harry: The Unwelcome Return of "Best Viewed with Internet Explorer". technologizer.com, 2010. szeptember 16. (Hozzáférés: 2016. július 16.)
  6. ↑ Mozilla Firefox Internet Browser Market Share Gains to 7.4%. Search Engine Journal, 2004. november 24. (Hozzáférés: 2011. december 7.)
  7. ↑ Grammar and types - JavaScript. MDN Web Docs. (Hozzáférés: 2025. április 29.)
  8. ↑ undefined - JavaScript. MDN Web Docs. (Hozzáférés: 2025. április 30.)
  9. ↑ Symbol - JavaScript. MDN Web Docs. (Hozzáférés: 2025. április 30.)
  10. ↑ Template literals (Template strings) - JavaScript. MDN Web Docs. (Hozzáférés: 2025. április 30.)
  11. ↑ const - JavaScript. MDN Web Docs. (Hozzáférés: 2025. május 1.)
  12. ↑ a b Jason Orendorff: ES6 In Depth: let and const. Mozilla Hacks – the Web developer blog, 2015. július 31. (Hozzáférés: 2025. május 1.)
  13. ↑ https://developer.mozilla.org/en/JavaScript/Reference/Operators/Operator_Precedence

Kapcsolódó szócikkek

[szerkesztés]

Több projekt foglalkozik más programnyelvekről JavaScript-re fordítással:

További információk

[szerkesztés]
A lap eredeti címe: „https://hu.wikipedia.org/w/index.php?title=JavaScript&oldid=28143298”