JavaScript alapok

Tartalomjegyzék

  1. nyelvi elemek
  2. adatok bevitele és kiírása
  3. vezérlési szerkezetek
  4.  
  5. ajánlott irodalom, felhasznált források
  6. gyakorló feladatok

A példákhoz használt online JavaScript interpreter:

Online JavaScript Interpreter by Peter Jipsen, Chapman University (January 2013).
http://math.chapman.edu/~jipsen/js/ (2018-12-12)


a JavaScript nyelvi elemei

Írjon be egy adatot:

[elemi adattípusok, adatok (literálok)]

[változók, változótípusok]

[elemi típusú változók]

// számrendszerek

var x,d,b,h;

x=123;
d=Number(x).toString();
writeln(x+" | "+d);

x=123;
b=Number(x).toString(2);
writeln(x+" | "+b);

x=123;
h=Number(x).toString(16);
writeln(x+" | "+h);

writeln("--------------------------------------------------");

b="10110100";
x=parseInt(b,2)
writeln(x+" | "+b);

h="2cd";
x=parseInt(h,16)
writeln(x+" | "+h);

writeln("--------------------------------------------------");

b="10101010";

write(b+" közvetlen átváltása decimális számrendszerbe: ");
x=1*128+0*64+1*32+0*16+1*8+0*4+1*2+0*1;
writeln(x);

x=0; // részösszegek
he=1; // helyiérték
i=b.length-1; // ciklusváltozó

while(i>=0) {
 d=parseInt(b.charAt(i),2); // számjegy adott helyiértéken
 x+=d*he; // vagy x=x+d*he;
 he*=2; // vagy he=he*2;
 i--; // vagy i=i-1;
 }

writeln(b+"  -->  "+x);
writeln("--------------------------------------------------");

h="3de5";

write(h+" közvetlen átváltása decimális számrendszerbe: ");
x=3*16**3+13*16**2+14*16+5*1;
writeln(x);

x=0; // részösszegek
he=1; // helyiérték
i=h.length-1; // ciklusváltozó

while(i>=0) {
 d=parseInt(h.charAt(i),16); // számjegy adott helyiértéken
 x+=d*he; // vagy x=x+d*he;
 he*=16; // vagy he=he*16;
 i--; // vagy i=i-1;
 }

writeln(h+"  -->  "+x);
writeln("--------------------------------------------------");

[egy- és többdimenziós tömbök (array)]

Egy példa egydimenziós tömbök létrehozására:

// egydimenziós tömbök

var tanulok=["Jancsi","Zoe","Peti","Kata","Ildi"];
var i;

tanulok[5]="Tercsi"; // vagy tanulok[this.length]="Tercsi";
tanulok[6]="Fercsi";

writeln("Névsor:\n");

for(i=0;i<tanulok.length;i++) {
 writeln(tanulok[i]);
 }

writeln("\nÖsszesen "+tanulok.length+" tanuló.\n");

writeln("--------------------------------------------------");

tanulok.sort();

writeln("Rendezett névsor:\n");

for(i=0;i<tanulok.length;i++) {
 writeln(tanulok[i]);
 }

writeln("--------------------------------------------------");

Egy példa egydimenziós, számokból álló tömbök (vektorok) létrehozására és a tömb elemeinek összeadására:

// számok (tömbelemek) összeadása

var szamok=[1,4,3,2];
var i,osszeg=0;

for(i=0;i<szamok.length;i++) {
 osszeg+=szamok[i];
 // if(i+1>=szamok.length) break;
 writeln("részösszeg: "+osszeg);
 }

writeln("\nvégösszeg: "+osszeg);

writeln("--------------------------------------------------");

Egy példa többdimenziós tömbök (mátrixok) létrehozására és kiírására:

// többdimenziós tömbök (mátrixok) létrehozása

// négyzetes mátrix

var i,j;
var matrix=[
 [1,4,3,2],
 [6,1,5,5],
 [1,2,3,4],
 [7,1,2,6]
 ];

for(i=0;i<matrix.length;i++) {
 for(j=0;j<matrix.length;j++) {
  write(matrix[i][j]+" ");
  }
 writeln();
 }

writeln("--------------------------------------------------");

// általános mátrix

matrix=[
 [1,4,3,2,8],
 [6,1,5,5,0],
 [1,2,3,4,9],
 [7,1,2,6,4]
 ];

// 4 sor és 4 oszlop kiírása

for(i=0;i<matrix.length;i++) {
 for(j=0;j<matrix.length;j++) {
  write(matrix[i][j]+" ");
  }
 writeln();
 }

writeln();

// 4 sor és 5 oszlop kiírása

for(i=0;i<matrix.length;i++) {
 for(j=0;j<matrix[i].length;j++) {
  write(matrix[i][j]+" ");
  }
 writeln();
 }

writeln("--------------------------------------------------");

[objektumok]

[nem definiált értékű és típusú változók]

Az azonosítók (pl. a változók neve) esetében tartsuk be a következőket: a nevek kezdődjenek kisbetűvel és csak betűket, számjegyeket, és aláhúzás-karaktert (_) tartalmazzanak. Az azonosítók neveiben a nagy- és kisbetűk különbözőek, nagybetűt csak kivételes esetben használjunk (pl. két szóból álló név esetén, szóköz helyett: tanuloNeve, tanarNeve stb.), és a magyar ékezetes betűket a nevekben ne használjuk.

[operátorok, függvények]

aritmetikai operátorok

logikai operátorok


Lássunk néhány példát a logikai operátorok használatára:

// igazságtáblázat készítése (implikáció)

function imp(x,y) {
 var a=Boolean(x), b=Boolean(y);
 var c=!a || b;
 return Number(c);
 }

writeln("A"+" " +"B"+" "+"⊃");
writeln("A"+" " +"B"+" "+"\u2283");
writeln("-----");

for(i=0;i<=1;i++) {
 for(j=0;j<=1;j++) {
  writeln(i+" " +j+" "+imp(i,j));
  }
 }

writeln("--------------------------------------------------");

Készítsük el a

geza(A,B) = ( A ⊃ ( A ⊃ B) ) ∨. A

és a

peti(A,B) = ( ( A ⊃ B) ⊃ A ) ∨. A

logikai függvények igazságtáblázatát:

// geza(A,B) = ( A ⊃ ( A ⊃ B) ) ∨. ⌝A
// peti(A,B) = ( ( A ⊃ B) ⊃ A ) ∨. ⌝A

function imp(x,y) {
 var a=Boolean(x), b=Boolean(y);
 var c=!a || b;
 return Number(c);
 }

function geza(x,y) {
 var a=Boolean(x), b=Boolean(y);
// var c=(imp(x,imp(x,y))) || !a;
// var c=(imp(a,imp(a,b))) || !a;
  var c=(!a || (!a || b)) || !a;
 return Number(c);
 }

function peti(x,y) {
 var a=Boolean(x), b=Boolean(y);
// var c=(imp(imp(x,y),x)) || !a;
// var c=(imp(imp(a,b),a)) || !a;
  var c=(!(!a || b) || a) || !a;
 return Number(c);
 }

writeln("A"+" " +"B"+" "+"(A g B)");
writeln("-----------");

for(i=0;i<=1;i++) {
 for(j=0;j<=1;j++) {
  writeln(i+" " +j+"    "+geza(i,j));
  }
 }

writeln("--------------------------");

writeln("A"+" " +"B"+" "+"(A p B)");
writeln("-----------");

for(i=0;i<=1;i++) {
 for(j=0;j<=1;j++) {
  writeln(i+" " +j+"    "+peti(i,j));
  }
 }

writeln("--------------------------");

Készítsük el a kata(A,B) = ( A ∧ ( A ⊃ B) ) logikai függvény igazságtáblázatát:

// kata(A,B) = ( A ∧ ( A ⊃ B) ) 

function imp(x,y) {
 var a=Boolean(x), b=Boolean(y);
 var c=!a || b;
 return Number(c);
 }

function kata(x,y) {
 var a=Boolean(x), b=Boolean(y);
// var c=a && imp(x,y);
// var c=a && imp(a,b);
 var c=a && (!a || b);
 return Number(c);
 }

writeln("A"+" " +"B"+" "+"(A k B)");
writeln("-----------");

for(i=0;i<=1;i++) {
 for(j=0;j<=1;j++) {
  writeln(i+" " +j+"    "+kata(i,j));
  }
 }

writeln("--------------------------");

Végül egy összetettebb példa: készítsük el az mp(A,B) = ( A ∧ ( A ⊃ B) ) ⊃. B logikai függvény igazságtáblázatát, valamint Quine-táblázatát:

// mp(A,B) = ( A ∧ ( A ⊃ B) ) ⊃. B (modus ponens)

function imp(x,y) {
 var a=Boolean(x), b=Boolean(y);
 var c=!a || b;
 return Number(c);
 }

function mp(x,y) {
 var a=Boolean(x), b=Boolean(y);
 var c=!(a && (!a || b)) || b;
 return Number(c);
 }

writeln("A"+" " +"B"+" "+"mp(A,B)");
writeln("-----------");

for(i=0;i<=1;i++) {
 for(j=0;j<=1;j++) {
  writeln(i+" " +j+"     "+mp(i,j));
  }
 }

writeln("--------------------------------------------------");

writeln("( A ∧ ( A ⊃ B) ) ⊃. B");
writeln("-----------");

for(i=0;i<=1;i++) {
 for(j=0;j<=1;j++) {
  writeln(" "+
         i+" " +
         Number(i && imp(i,j))+"  "+  
         i+" "+
         imp(i,j)+" "+
         j+" | "+
         mp(i,j)+" | "+
         j);
  }
 }

writeln("--------------------------------------------------");

Megjegyzések:

(I.) Az mp(A,B) = ( A ∧ ( A ⊃ B) ) ⊃. B logikai függvény Quine-táblázatában a belső ( A ∧ ( A ⊃ B) ) konjunkciót (i && imp(i,j)) módon állíthatjuk elő (A ↔ i, B ↔ j), mert az 'i' ciklusváltozó 0 vagy 1 értékű szám, amelyet a && logikai operátor használata miatt a JavaScript interpreter automatikusan logikai (Boolean) értékké alakít át. Azonban a kifejezés értéke logikai érték (true vagy false) lesz, amit a táblázatban számként (1 vagy 0) akarunk megjeleníteni, tehát a logikai kifejezés értékét számmá kell alakítanunk Number(Boolean(i) && imp(i,j)) módon.

(II.) A modus ponens következtetési szabálynak megfelelő logikai törvény levezethető a logikai azonosságokból:

( A ∧ ( A ⊃ B) ) ⊃. B ~ ( A ∧ ( A ∨ B) ) ⊃. B (az implikáció átalakítása)
( A ∧ ( A ∨ B) ) ⊃. B ~ ( ( A ∧ A ) ∨ ( A ∧ B) ) ⊃. B (disztributivitás)
( ( A ∧ A ) ∨ ( A ∧ B) ) ⊃. B ~ ( A ∧ B ) ⊃. B (az ellentmondás törvénye és a ⊥ ∨ P ~ P kiszámítási törvény)
( A ∧ B ) ⊃. B ~ ( A ∧ B ) ∨ B (az implikáció átalakítása)
( A ∧ B ) ∨ B ~ ( A ∨ B ) ∨ B (De Morgan-azonosság)
( A ∨ B ) ∨ B ~ A ∨ ( B ∨ B ) (asszociativitás)
A ∨ ( B ∨ B ) ~ (a kizárt harmadik törvénye és a P ∨ ⊤ ~ ⊤ kiszámítási törvény).

Vagyis az mp(A,B) = ( A ∧ ( A ⊃ B) ) ⊃. B logikai függvény tautológia.


összehasonlító operátorok

matematikai állandók, függvények (Math osztály)

// kör kerülete és területe

var kor_sugara, x,xk,xt;

kor_sugara=4;
xk=(2*kor_sugara*Math.PI);

writeln("kerület = "+xk);
x=Math.round(xk*100)/100;
// x=xk.toFixed(2);
writeln("kerület (közelítőleg) = "+x);

writeln("--------------------------------------------------");

xt=kor_sugara*kor_sugara*Math.PI;
writeln("terület = "+xt);
x=Math.round(xt*100)/100;
// x=xt.toFixed(2);
writeln("terület (közelítőleg) = "+x);

writeln("--------------------------------------------------");

karakterláncokkal kapcsolatos függvények, operátorok, elemváltozók, metódusok (String osztály)

// betűk kiírása egymás alá

var s;
var idezojel="?"; // stringen belül nem lehet közvetlenül megadni
var i;

s="Hello!";
for(i=0;i<s.length;i++){
 writeln(s.charAt(i));
 }

writeln("--------------------------------------------------");

// betűk kiírása egymás mellé, szóközzel elválasztva

s="HELLO-BELLO";
for(i=0;i<s.length;i++){
 write(s.charAt(i)+" "); 
 }

writeln();
writeln("--------------------------------------------------");

// az idézőjel kódját megnéztük a Google-val (34 vagy 0x22)
// idezojel=String.fromCharCode(34);
idezojel="\u0022";

s="alma kajszibarack";
// writeln("Az \""+s+"\" string hossza: "+s.length);
writeln("Az "+idezojel+s+idezojel+ " string hossza: "+s.length);

writeln("--------------------------------------------------");

i=0;
while(i<s.length) {
writeln("Az "+idezojel+
 s.substring(0,4)+"..."+
 idezojel+
 " string "+i+"-dik karaktere: "+
 s.charAt(i));
 i++;
 }

writeln("--------------------------------------------------");

adatok bevitele és kiírása

Egy egyszerű táblázat
1 2
3 4

Egy egyszerű bekezdés

adatok bevitele

adatok kiírása


vezérlési szerkezetek

utasításblokkok

függvények

ciklusok

Hozzuk létre a 'szamok' tömböt pl. var szamok=[1,4,3,2]; módon!

// egyszerű ciklusok

var i,m,n,s;

writeln("első 5 természetes szám (while):\n"); 

i=1;
while(i<=5) {
 writeln(i);
 i++;
 }

writeln("--------------------------------------------------");

writeln("első 5 természetes szám (for):\n"); 
for(i=1;i<=5;i++) {
 writeln(i);
 }

writeln("--------------------------------------------------");

m=3;
n=10;
writeln("'m' és 'n' közötti természetes számok:\n"); 
for(i=m;i<=n;i++) {
 writeln(i);
 }

writeln("--------------------------------------------------");

s="A";
writeln("sok 'A' kiírása:\n"); 
i=0;
while(i<5){
 writeln((i+1)+"-dik ismétlés: "+s);
 s+="A";
 i++; 
 }

writeln("--------------------------------------------------");

elágazások

// páros számok kiíratása

var i,n=10;

for(i=1;i<=n;i++) {
 if(i%2==0) {
  writeln(i);
  }
 }

writeln("--------------------------------------------------");

// hárommal osztható számok kiíratása

for(i=1;i<=n;i++) {
 if(i%3==0) {
  writeln(i);
  }
 }

writeln("--------------------------------------------------");

// hárommal osztható páros számok kiíratása

for(i=1;i<=n;i++) {
 if(i%2==0 && i%3==0) {
  writeln(i);
  }
 }

writeln("--------------------------------------------------");

Irodalomjegyzék

Moncur, Michael 2006. Tanuljuk meg a JavaScript használatát 24 óra alatt. [SAMS Teach Yourself HTML and CSS in 24 Hours.] Budapest: Kiskapu.

Suehring, Steven; Valade, Janet 2014. PHP, MySQL, JavaScript és HTML5. Budapest: Panem K. (Tantusz könyvek)

Internetes források

Online JavaScript Interpreter by Peter Jipsen, Chapman University (January 2013).
http://math.chapman.edu/~jipsen/js/ (2018-12-12)

W3Schools Online Web Tutorials.
https://www.w3schools.com/ (2018-11-23)

JavaScript Tutorial.
https://www.w3schools.com/js/ (2018-12-12)

JavaScript and HTML DOM Reference.
https://www.w3schools.com/jsref/default.asp (2018-12-12)

JavaScript Global Reference.
https://www.w3schools.com/jsref/jsref_obj_global.asp (2018-12-12)

A JavaScript programozási nyelv. (Programnyelvek portál.)
http://nyelvek.inf.elte.hu/leirasok/JavaScript/index.php?chapter=24 (2018-12-12)


Boda István, 2018.