Felhasználói eszközök

Eszközök a webhelyen


oktatas:web:javascript:javascript_maskent

Különbségek

A kiválasztott változat és az aktuális verzió közötti különbségek a következők.

Összehasonlító nézet linkje

oktatas:web:javascript:javascript_maskent [2019/08/22 19:53] (aktuális)
admin létrehozva
Sor 1: Sor 1:
 +[[oktatas:​web:​javascript|<​ JavaScript]]
 +
 +====== JavaScript másként ======
 +
 +  * **Szerző:​** Sallai András
 +  * Copyright (c) Sallai András, 2013
 +  * Licenc: GNU Free Documentation License 1.3
 +  * Web: http://​szit.hu
 +===== Első program =====
 +
 +Készítsük el a következő állományt:​
 +
 +<code html>
 +<​!DOCTYPE html>
 +<​html>​
 +<​head>​
 +
 +<meta charset="​utf-8">​
 +<​title>​JavaScript</​title>​
 +
 +<​script>​
 +  console.log("​Üdvözöllek a JavaScriptben"​);​
 +</​script>​
 +
 +</​head>​
 +<​body>​
 +
 +</​body>​
 +</​html>​
 +</​code>​
 +
 +Ez után nyissuk meg egy böngészőben. A Chrome böngészőben nyissuk meg a JavaScript konzolablakot:​ Ctrl+Shift+I,​ majd a Console ikon. 
 +Firefox alatt Ctrl+Shift+K.
 +
 +===== Megjegyzések =====
 +
 +Megjegyzéseket a következő módon írhatunk:
 +
 +<code javascript>​
 +//egy soros megjegyzés
 +/* több
 +   soros
 +   ​megjegyzés
 +*/
 +console.log("​Csak megjegyzés"​);​
 +</​code>​
 +
 +===== Változóhasználat =====
 +
 +<code javascript>​
 +var nev = "Nagy József";​
 +console.log(nev);​
 +</​code>​
 +
 +
 +===== Metódus írása =====
 +==== Egy metódus megírása ====
 +
 +<code html>
 +<​!DOCTYPE html>
 +<​html>​
 +<​head>​
 +
 +<meta charset="​utf-8">​
 +<​title>​JavaScript</​title>​
 +
 +<​script>​
 +nevjegy();
 +function nevjegy()
 +{
 + console.log("​Üdvözöllek a JavaScriptben"​);​
 + console.log("​Nagy József"​);​
 +}
 +
 +</​script>​
 +
 +</​head>​
 +<​body>​
 +
 +</​body>​
 +</​html>​
 +</​code>​
 +
 +A metódus meghívható annak deklarációja előtt és utána is:
 +
 +<code javascript>​
 +nevjegy();
 +function nevjegy()
 +{
 + console.log("​Üdvözöllek a JavaScriptben"​);​
 + console.log("​Nagy József"​);​
 +}
 +</​code>​
 +
 +<code javascript>​
 +function nevjegy()
 +{
 + console.log("​Üdvözöllek a JavaScriptben"​);​
 + console.log("​Nagy József"​);​
 +}
 +nevjegy();
 +</​code>​
 +
 +==== Paraméter ====
 +
 +<code javascript>​
 +udv("​Jóska"​);​
 +function udv(nev)
 +{
 + console.log("​Üdvözöllek " + nev + " a JavaScriptben"​);​
 +}
 +</​code>​
 +
 +
 +==== Több paraméter ====
 +
 +<code javascript>​
 +osszead(3, 5);
 +function osszead(a, b)
 +{
 + console.log(a + b);
 +}
 +</​code>​
 +
 +==== Visszaadott érték ====
 +
 +<code javascript>​
 +console.log("​Összeg:​ " + osszead(3, 5));
 +
 +function osszead(a, b)
 +{
 + return a + b;
 +}
 +</​code>​
 +
 +==== Függvény változóként ====
 +
 +
 +
 +<code javascript>​
 +var nevjegy = function()
 +{
 + console.log("​Nagy József"​);​
 + console.log("​Föld"​);​
 +};
 +
 +nevjegy();
 +</​code>​
 +
 +Változóként létrehozva ugyanúgy használjuk a metódust, de csak a metódus deklarációja után 
 +hívhatjuk meg.
 +
 +
 +===== Változók hatásköre =====
 +
 +Függvényen belül létrehozott változók csak a függvények belül láthatók. ​
 +
 +<code javascript>​
 +function ez() {
 + var nev = "​Józsi";​
 +}
 +console.log(nev);​
 +</​code>​
 +
 +A globális változók viszont látszanak egy függvényen belül.
 +<code javascript>​
 +var nev = "​Jóska";​
 +function kiir() {
 + console.log(nev);​
 +}
 +kiir();
 +</​code>​
 +
 +===== Típusok =====
 +
 +A JavaScriptben a változók létrehozásakor nem kell megadni annak típusát.
 +A bennük tárolt adat alapján viszont lekérdezhető azok típusa.
 +
 +<code javascript>​
 +var nev = "​Józsi";​
 +console.log(typeof(nev));​
 +</​code>​
 +
 +A fenti program kimenet például: string
 +
 +Ha a szöveg helyett számot adok meg:
 +<code javascript>​
 +var nev = "​Józsi";​
 +console.log(typeof(nev));​
 +</​code>​
 +A kimenet: number
 +
 +
 +===== Operátorok =====
 +
 +<code javascript>​
 +var a = 3;
 +var b = 5;
 +var e = a>b;
 +console.log(e);​
 +</​code>​
 +
 +
 +<code javascript>​
 +var a = -3;
 +var b = 5;
 +var e = a>0 || b>0;
 +console.log(e);​
 +</​code>​
 +
 +<code javascript>​
 +var a = 3;
 +var b = 5;
 +var e = a>0 && b>0;
 +console.log(e);​
 +</​code>​
 +
 +
 +<code javascript>​
 +console.log( '​a'​ + 2 );           // '​a2'​
 +console.log( '​5'​ + 3 );           // '​53'​
 +console.log( '​hat'​ - '​3'​ );      // NaN (not a number)
 +console.log( - '​1'​ );             // -1
 +console.log( 1 + true );          // 2
 +console.log( 1 == true );         // true
 +console.log( 1 === true );        // false
 +</​code>​
 +
 +
 +===== Szelekció =====
 +
 +<code javascript>​
 +if(1)
 + console.log("​Igaz"​);​
 +</​code>​
 +
 +<code javascript>​
 +var a = 3;
 +if (a > 0) {
 + console.log("​Pozitív szám"​);​
 +}
 +else {
 + console.log("​Nulla vagy negatív"​);​
 +}
 +</​code>​
 +
 +
 +===== Iteráció =====
 +
 +A "​Többször"​ szó ötször:
 +<code javascript>​
 +for(i=0; i<5; i++)
 + console.log("​Többször"​);​
 +</​code>​
 +
 +Számok 1-től 5-ig:
 +<code javascript>​
 +for(i=1; i<6; i++)
 + console.log(i);​
 +</​code>​
 +
 +
 +===== Tömb =====
 +
 +<code javascript>​
 +var tomb = [3, 5, 2, 8, 4, 1];
 +console.log(tomb[0]);​
 +</​code>​
 +
 +<code javascript>​
 +var tomb = new Array(3, 5, 2, 8, 4, 1);
 +console.log(tomb[0]);​
 +</​code>​
 +
 +
 +A tömb mérete:
 +
 +<code javascript>​
 +var tomb = new Array(3, 5, 2, 8, 4, 1);
 +console.log(tomb.length);​
 +</​code>​
 +
 +Tömb elemeit végigvesszük:​
 +
 +<code javascript>​
 +var tomb = new Array(3, 5, 2, 8, 4, 1);
 +for (i=0; i<​tomb.length;​ i++) {
 + console.log(tomb[i]);​
 +}
 +</​code>​
 +
 +===== Karaktersorozatok kezelése =====
 +
 +Üresség vizsgálata:​
 +<code javascript>​
 +var nev = "";​
 +if(!nev){
 + console.log("​Üres"​);​
 +}
 +else {
 + console.log("​Van"​);​
 +}
 +</​code>​
 +===== Objektum =====
 +
 +==== Objektum létrehozása ====
 +
 +<code javascript>​
 +var Dolgozo = {
 + nev : "Nagy József",​
 + kor : 32,
 + fiz : 650000
 +};
 +
 +console.log(Dolgozo.nev);​
 +console.log(Dolgozo.kor);​
 +</​code>​
 +
 +==== Hozzáférés ====
 +
 +
 +Hozzáférés az adattagokhoz másként:
 +
 +<code javascript>​
 +var Dolgozo = {
 + nev : "Nagy József",​
 + kor : 32,
 + fiz : 650000
 +};
 +
 +console.log(Dolgozo['​nev'​]);​
 +console.log(Dolgozo['​kor'​]);​
 +</​code>​
 +
 +==== Módosítás ====
 +
 +
 +Az adattagok módosítása:​
 +
 +<code javascript>​
 +var Dolgozo = {
 + nev : "Nagy József",​
 + kor : 32,
 + fiz : 650000
 +};
 +
 +console.log(Dolgozo.fiz);​
 +Dolgozo.fiz = 879500;
 +console.log(Dolgozo.fiz);​
 +</​code>​
 +
 +==== Metódus ====
 +
 +Metódusokat is létrehozhatunk,​ amellyel az adattagokat elérhetjük lekérdezés vagy módosítás céljából.
 +
 +
 +
 +<code javascript>​
 +var Dolgozo = {
 + nev : "Nagy József",​
 + kor : 32,
 + fiz : 650000,
 + kiNev : function(){
 + console.log(this.nev);​
 + }
 +};
 +Dolgozo.kiNev();​
 +</​code>​
 +
 +A this kulcsszó azt jelenti az adott objektum. A metódusokból csak
 +így tudjuk elérni az adattagokat. Úgy fordíthatnánk,​ hogy ezen objektum
 +nev adattagja. Próbáljuk ki a metódust a this kulcsszó nélkül is. 
 +
 +
 +
 +<code javascript>​
 +var Dolgozo = {
 + nev : "Nagy József",​
 + kor : 32,
 + fiz : 650000,
 + fizetesEmel : function(emeles){
 + this.fiz = this.fiz + emeles;
 + }
 +};
 +Dolgozo.fizetesEmel(100000);​
 +console.log(Dolgozo.fiz);​
 +</​code>​
 +
 +
 +<code javascript>​
 +var Dolgozo = {
 + nev : "Nagy József",​
 + kor : 32,
 + fiz : 650000,
 + kiNev : function(){
 + console.log(this.nev);​
 + }
 +};
 +var iro = Dolgozo.kiNev;​
 +iro.call(Dolgozo);​
 +</​code>​
 +
 +
 +<code javascript>​
 +
 +var Dolgozo = {
 + nev : "Nagy József",​
 + kor : 32,
 + fiz : 650000,
 + kiNev : function(){
 + console.log(this.nev);​
 + },
 + fizetesEmel : function(emeles) {
 + this.fiz = this.fiz + emeles;
 + }
 +};
 +var emelo = Dolgozo.fizetesEmel;​
 +emelo.call(Dolgozo,​ 100000);
 +
 +console.log(Dolgozo.fiz);​
 +</​code>​
  
oktatas/web/javascript/javascript_maskent.txt · Utolsó módosítás: 2019/08/22 19:53 szerkesztette: admin