User Tools

Site Tools


tanszek:oktatas:web_technologia_alapjai:js

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
tanszek:oktatas:web_technologia_alapjai:js [2025/03/09 13:40] – [Feladat] kissatanszek:oktatas:web_technologia_alapjai:js [2025/03/10 17:50] (current) kissa
Line 7: Line 7:
 JavaScript kódok beágyazhatóak HTML dokumentumba, a ''<script>'' elem segítségével: JavaScript kódok beágyazhatóak HTML dokumentumba, a ''<script>'' elem segítségével:
  
-<code html>+<sxh html>
 <!DOCTYPE html> <!DOCTYPE html>
 <html lang="en"> <html lang="en">
Line 24: Line 24:
 </body> </body>
 </html> </html>
-</code>+</sxh>
  
 Ezen kívül külső fájlból is importálhatók: Ezen kívül külső fájlból is importálhatók:
  
-<code html>+<sxh html>
 <!DOCTYPE html> <!DOCTYPE html>
 <html lang="en"> <html lang="en">
Line 43: Line 43:
 </body> </body>
 </html> </html>
-</code>+</sxh>
  
 ==== Fejlesztői konzol ==== ==== Fejlesztői konzol ====
Line 57: Line 57:
 A ''let'' kulcsszó használata esetén a változó a későbbiekben kaphat más értéket, míg ''const'' kulcsszó esetén az érték később nem változtatható. A ''let'' kulcsszó használata esetén a változó a későbbiekben kaphat más értéket, míg ''const'' kulcsszó esetén az érték később nem változtatható.
  
-<code javascript>+<sxh javascript>
 let x = 10; let x = 10;
  
 const pi = 3.14; const pi = 3.14;
-</code>+</sxh>
  
 ==== Primitív adattípusok ==== ==== Primitív adattípusok ====
Line 72: Line 72:
   * ''undefined'': a változó deklarált, de nem kapott még értéket   * ''undefined'': a változó deklarált, de nem kapott még értéket
  
-<code javascript>+<sxh javascript>
 let name = 'Béla'; // string let name = 'Béla'; // string
 let age = 15; // number let age = 15; // number
Line 78: Line 78:
 let email = null; let email = null;
 let phoneNumber = undefined; let phoneNumber = undefined;
-</code>+</sxh>
  
 ==== Elágazások ==== ==== Elágazások ====
Line 84: Line 84:
 Az elágazások segítségével a program különböző utakon haladhat előre, a megjelölt feltételek teljesülése esetén. Az elágazások segítségével a program különböző utakon haladhat előre, a megjelölt feltételek teljesülése esetén.
  
-<code javascript>+<sxh javascript>
 let age = 20; let age = 20;
  
Line 94: Line 94:
     console.log("Nyugdíjas");     console.log("Nyugdíjas");
 } }
-</code>+</sxh>
  
 ==== Ciklusok ==== ==== Ciklusok ====
Line 100: Line 100:
 A ciklusok lehetővé teszik a kód ismételt végrehajtását, amíg egy adott feltétel teljesül. A ciklusok lehetővé teszik a kód ismételt végrehajtását, amíg egy adott feltétel teljesül.
  
-<code javascript>+<sxh javascript>
 // for ciklus: számok kiíratása 0-4-ig // for ciklus: számok kiíratása 0-4-ig
 for (let i = 0; i < 5; i++) { for (let i = 0; i < 5; i++) {
Line 115: Line 115:
  
 console.log(factorial); console.log(factorial);
-</code>+</sxh>
  
 ==== Tömbök ==== ==== Tömbök ====
Line 122: Line 122:
 Ezek típusa nem kötött, egy tömb akár többféle adattípussal rendelkező értéket is tárolhat. Ezek típusa nem kötött, egy tömb akár többféle adattípussal rendelkező értéket is tárolhat.
  
-<code javascript>+<sxh javascript>
 const values = [ "red", "green", "blue", 0, 5, true ]; const values = [ "red", "green", "blue", 0, 5, true ];
-</code>+</sxh>
  
 +=== Tömb bejárása ciklusokkal ===
 +
 +== for-in ciklus ==
 +
 +A ''for-in'' ciklus a tömb indexeit járja be:
 +
 +<sxh javascript>
 +for (const index in values) {
 +    console.log(`Index: ${index}, Érték: ${values[index]}`);
 +}
 +</sxh>
 +
 +== for-of ciklus ==
 +
 +A ''for-of'' ciklus közvetlenül a tömb elemeit járja be:
 +
 +<sxh javascript>
 +for (const value of values) {
 +    console.log(`Érték: ${value}`);
 +}
 +</sxh>
 +
 +=== Transzformációs metódusok ===
 +
 +== map metódus ==
 +
 +A ''map'' metódus egy új tömböt hoz létre az eredeti tömb elemeinek módosításával:
 +
 +<sxh javascript>
 +const values = [ 'red', 'green', 'blue' ];
 +const uppercasedValues = values.map(value => value.toUpperCase());
 +console.log(uppercasedValues);
 +</sxh>
 +
 +== filter metódus ==
 +
 +A ''filter'' metódus egy új tömböt hoz létre az eredeti tömb azon elemeiből, amelyek megfelelnek egy feltételnek:
 +
 +<sxh javascript>
 +const numbers = [1, 156, 1499, 142, 111, 42];
 +const evenNumbers = numbers.filter(value => value % 2 == 0);
 +console.log(evenNumbers);
 +</sxh>
 ==== Függvények ==== ==== Függvények ====
  
Line 131: Line 174:
 Lehetnek olyan eljárások, amik csak végrehajtanak egy feladatot, vagy akár olyanok is, amik visszatérési értékkel is rendelkezhetnek. Lehetnek olyan eljárások, amik csak végrehajtanak egy feladatot, vagy akár olyanok is, amik visszatérési értékkel is rendelkezhetnek.
  
-<code javascript>+<sxh javascript>
 function greet(name) { function greet(name) {
     console.log("Hello, " + name + "!");     console.log("Hello, " + name + "!");
Line 143: Line 186:
  
 console.log(square(2)); // 4 console.log(square(2)); // 4
-</code>+</sxh>
  
 ==== Objektumok ==== ==== Objektumok ====
Line 149: Line 192:
 Az objektumok kulcs-érték párokat tárolnak. A kulcsok szövegek (''name'', ''age'', ''male'', ''greet''), míg az értékek valamely primitív (pl. ''number'', ''string'', ''boolean'', ''null'', ''undefined'') vagy összetett (pl. ''Object'', ''Array'', ''Function'') adattípusba tartozhatnak. Az objektumok kulcs-érték párokat tárolnak. A kulcsok szövegek (''name'', ''age'', ''male'', ''greet''), míg az értékek valamely primitív (pl. ''number'', ''string'', ''boolean'', ''null'', ''undefined'') vagy összetett (pl. ''Object'', ''Array'', ''Function'') adattípusba tartozhatnak.
  
-<code javascript>+<sxh javascript>
 let person = { let person = {
     name: "John",     name: "John",
Line 158: Line 201:
     }     }
 }; };
-</code>+</sxh>
  
 ==== Feladat ==== ==== Feladat ====
tanszek/oktatas/web_technologia_alapjai/js.1741527606.txt.gz · Last modified: 2025/03/09 13:40 by kissa