Ugrás a tartalomhoz

JavaScript

Ellenőrzött
A Wikipédiából, a szabad enciklopédiából
JavaScript
ParadigmaMulti-paradigma: szkript, objektumorientált (prototípus-alapú), imperatív, funkcionális
Jellemző kiterjesztés.js
Megjelent1996. május
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]
 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!

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]
Ez 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]
Ez 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]
Elsődleges elemi adattípusok
  • String (karakterlánc)
  • Number (szám, lehet tizedestört vagy egész szám is)
  • Boolean (értéke igaz vagy hamis)
Speciális típusok
  • Undefined (meghatározatlan, így nincs értéke)
  • Null (kifejezetten semmiként van meghatározva)
Összetett típusok
  • Object (objektum)
  • Array (lista, amely több különböző adattípust is tartalmazhat)
  • Set (speciális lista, amely minden értékből csak egyet tartalmazhat)
Fontosabb objektumok
  • Date (dátum)
  • RegExp (reguláris kifejezés)
  • Function (függvény)
  • Math (matematikai függvények gyűjteménye)

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

var a = "I'm sorry.";
var b = 'Idézőjel: (")';
var c = " \" ' ";

ami egyszerűbben:

var a="I'm sorry.", 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. Számszerű értékek lehetnek egész (decimális, hexadecimális, oktális), vagy tizedes számok. Léteznek különleges értékek is, mint az előzőekben említett 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.

Változók

[szerkesztés]

A JavaScript nyelvben minden változót előzetesen deklarálni kell. Ezt globális szinten a var, lokális szinten a let vagy a const kulcsszóval tudjuk megtenni. Utóbbi használata esetén az értéke nem megváltoztatható. Az ES6 változat óta a var mellőzött, helyette 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

A var kulcsszóval definiált változók globális változók, tehát mindenhonnan elérhetőek. Használatuk mellőzendő, mivel könnyen okozhat nehezen felderíthető hibákat.

Lokális

Deklarálásuk a let kulcsszóval történik. Csak a változók definiálásának helyén, az adott szinten (scope) láthatóak.

Változók deklarálása
//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ó

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. 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[7]

Operátorok asszociativitása

[szerkesztés]
Ez 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.

Jegyzetek

[szerkesztés]
  1. ↑ ECMAScript® 2024 Language Specification, 2024. (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. ↑ 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=26830662”