If you can't read please download the document
Upload
vutram
View
247
Download
6
Embed Size (px)
Citation preview
JavaScript tananyag
1
JavaScript tananyag
Knye Attila
A 2. vfolyamos Mszaki informatikus tanulk
Mszaki programozs gyakorlat tantrgyhoz
Szchenyi Kzpiskola, Zalaegerszeg
Verzi: 2014. augusztus
JavaScript tananyag
2
Bevezets
JavaScript programozsi nyelv egy objektumalap szkriptnyelv, amelyet weblapokon elterjedten hasznlnak. Eredetileg Brendan
Eich, a Netscape Communications mrnke fejlesztette ki. Struktrjban a Java s a C programozsi nyelvhez ll kzel. A jelenleg
rvnyes szabvny az ECMA-262, ami a JavaScript 1.5-nek felel meg. Ez a szabvny egyben ISO szabvny is.
A JavaScript kd html fjlban vagy kln (jellemzen .js kiterjeszts) szvegfjlban van. Ezek a fjlok tetszleges
szvegszerkeszt (nem dokumentumszerkeszt) programmal szerkeszthetek. A JavaScript esetben a futsi krnyezet
jellemzen egy webbngsz (JavaScript-motorja). Windows krnyezetben futtathat a wscript.exe segtsgvel, vagy Linuxos
krnyezetben nodejs-el futtathat.
Ez a knyv a Szchenyi Istvn Szakkzpiskola Mszaki informatikus tanulk Mszaki programozs gyakorlat tantrgynak
tanmenett kveti. rrl rra jegyzetet, ismtlsi lehetsget, gyakorlst biztostva segti a haladst.
A leckk vgn -a fggelkben- gyors sszefoglalt tallunk az utastsok szintaktikjrl, az opertorokrl, gyakran alkalmazott
objektumokrl.
A forrsok fejezet tovbbi kiegsztket, tananyagokat, referencikat tartalmaz.
A dokumentum mrete a kpernys olvasshoz (s vettshez) igazodott. Mieltt kinyomtatnd, gondolj a krnyezetre, a paprra, a
hdokra, meg a vilgbkre.
Jogi nyilatkozat
A kvetkezket teheted a mvel:
- szabadon msolhatod, terjesztheted,
- szrmazkos mveket (feldolgozsokat) hozhatsz ltre. - Jelld meg! A szerz s a cm feltntetsvel. - Ne add el! Ezt a mvet nem hasznlhatod fel kereskedelmi clokra.
http://hu.wikipedia.org/wiki/JavaScripthttp://hu.wikipedia.org/wiki/Java_(programoz%C3%A1si_nyelv)http://hu.wikipedia.org/wiki/C_(programoz%C3%A1si_nyelv)http://hu.wikipedia.org/wiki/Ecma_Internationalhttp://hu.wikipedia.org/wiki/Isohttp://szimki.sulinet.hu/index.php?menu=602&dir=c3phay1pbmZvhttp://hu.wikipedia.org/wiki/Creative_Commons
JavaScript tananyag
3
1. lecke Hello World, avagy laza alapozs
Kedvenc szvegszerkesztnkben hozzunk ltre egy j res HTML (HTML multihighlighter a javasolt) dokumentumot.
Mentsk el .html kiterjesztssel.
Nyissuk meg a fjlt kedvenc bngsznkben.
JavaScript tananyag
// ide rjuk a programot (ide kell beszrni a knyben szerepl pldaprogikat!)
1. plda
JavaScript programunkat (innentl JS-nek nevezem) a mintnak megfelelen mindig a rsz kz kell rnunk. Ez
a tovbbi program-mintkban mr nem szerepel. A mintapldk kopi-pszt beilleszthetek s kiprblhatak. Fontos, hogy a JS
az utastsaiban klnbsget tesz kis s nagybet kztt. Figyeljnk erre nagyon!
A kpernyre (a bngsz vsznra) kzvetlenl a document.write utastssal tudunk kirni. Minden utastst pontosvesszvel
kell lezrni. A dupla perjel csak megjegyzs a programban, a fordt figyelmen kvl hagyja.
document.write('Hello World!');
// A megjelenteni kvnt szveget aposztrfok kz kell tenni.
2. plda
http://hu.wikipedia.org/wiki/Hello_Worldhttp://www.pspad.com/http://www.google.com/chrome
JavaScript tananyag
4
Termszetesen a szvegben alkalmazhatunk html formzst is. A 3. plda tbb adat egyidej megjelentst is mutatja:
document.write('Hello World!');
document.write('Hell vilg ez itt a msodik sor! ');
document.write('harmadik sor', ' ez is a harmadik sor'); /* A megjelenteni kvnt szveget aposztrfok kz kell tenni,
gy tbb soros megjegyzseket (kommenteket) is fzhetnk a progihoz,
csak ne feledjk el lezrni!
*/
3. plda
Az aposztrfok kz rt szveget a program megjelenti. Ha elhagyjuk az aposztrfot, akkor a program rtelmezni
prblja a bertakat, s a kifejezs eredmnyt jelenti meg:
document.write('1+1=',1+1,'');
/* persze ne keressnk tl mly rtelmet a progiban, hiszen a kvetkez sor
is ugyanazt az rtket szmolja ki */
document.write('2+1=',1+1,'');
4. plda
Ebbl kvetkezik, hogy tetszleges szmtani mveletet el tudunk vgezni:
document.write(1548*23+15/14-12, '');
// persze a JS ismeri a zrjelet, gy a kv. sor egszen ms eredmnyt hoz:
document.write(1548*(23+15)/(14-12), '');
/* precedencia szablynak hvjk randa nv, de mit tehetnk
az alkalmazott mveleti jeleket pedig aritmetikai opertoroknak nevezzk ez
sem szebb. Itt van mg egy: */
document.write('100 osztva 8cal a maradk=',100%8, '');
/* a szzalkjellel vgzett mvelet neve: Modulo, s az oszts maradkt adja.
Fura, de gyakran lesz r szksg. */
5. plda
JavaScript tananyag
5
2. lecke Bogarak a programban, avagy hibakeress
A kvetkez mintapldban szmos programhibt vtettem. Lssuk, milyen segtsget kaphatunk a hibk
megtallshoz.
document.write(1+1, ');
document.write(1+1, '')
documentum.write(1+1, '');
A bngszben futtatva a programot, fehr vszon fogad minket. Semmi hibazenet. Nzzk bngsznknt a
hibakeresst. Az Internet Explorer szerint veszlyes programozk vagyunk, akiktl jobb vakodni:
A bngsz als sarkban felkiltjel figyelmeztet a
hibra. Rkattintva kirja, hogy hnyadik sorban nem
tudja rtelmezni az utastst. Szerintem ne
hborgassuk tovbb ezt a bngszt, keressnk egy
bartsgosabbat (bocs Bill)
JavaScript tananyag
6
Mozilla Firefox bngszben kattintsunk az eszkzk
/hibakonzol sorra. A felugr ablak szpen mutatja a
forrskdban lv szintaktikai hibt. A hibaablak sajnos az
elz programok hibit is gyjti, gy lehet, hogy a lista
vgn talljuk a rnk vonatkoz zenetet. Egyszerbb az
Alaphelyzet gomb segtsgvel kitrlni minden zenetet,
majd frissts utn mr csak a rnk vonatkoz sor ltszik.
Google Chrome esetn a men-re katt, majd eszkzk/Java Script konzol (egyszerbb:CTRL-SHIFT-J) a kpen
lthat ablak als rszn megjelenik a hibs sor (ill. hibs sorok), a sorra kattintva a bngsz szpen kijelli a hibs
rszt, alrja, hogy mi a panasza. Itt pldul a 10. sorban nem rti a documen kifejezst. A felette lv kt sor mr
javtott. Hasonltsuk ssze a hibsat a mr javtottal.
Az itt elkvetett hibkat szintaktikai hibnak nevezzk. Ez azt jelenti, hogy nem a gondolkodsunkban volt a hiba
(az a szemantikai hiba lesz), hanem a nyelvet alkalmaztuk helytelenl. A programozk munkjuk sorn jelents idt
tltenek el programhibk keressvel, amit angolul debugging-nak (bogarszsnak) neveznek.
http://www.mozilla.org/hu/firefox/new/http://www.google.com/chrome
JavaScript tananyag
7
3. lecke Phanta rei, avagy vltozk a programban
document.write(kutya,'');
6. plda
Ez a plda hibazenetet eredmnyez (kutya is not defined), vagyis a fordt prblja rtelmezni a kutya kifejezst
(mint az 1+1-et), de nem sikerl neki. Akkor magyarzzuk meg a programnak, hogy mit rtnk ez alatt:
var kutya= 101; // ez egy fik, amibe egy szm kerlt document.write(kutya ,''); // most a 101 szm jelenik meg
document.write(kutya+1 ,''); // most a 102 szm jelenik meg
document.write(kutya*2 ,''); // most a 202 szm jelenik meg
document.write(kutya*kutya, ''); // most a 101 szm ngyzete jelenik meg
7. plda
A var kutya= '101'; utastssal (var: variant = vltoz) ltrehoztunk egy fikot, amibe egybl rtket is tettnk. Ez a fik
addig rzi meg a tartalmt, amg fell nem rjuk egy jabb rtkkel, pl. gy: kutya=42; Az rtkadssal azt is
megmondtuk, hogy milyen tpus adatot kvnunk trolni. A JS hrom elemi adattpust ismer: szm, karakteres
(string-nek nevezzk) s logikai.
var a = 101; // ez egy szm (number) tpus vltoz
var f = 3.1415926; // ez is szm (tizedesPONT!)
var n = 1e4; // ez egy szm normlalakja (10000)
var b = 'kutya'; // ez egy karakteres vltoz aposztrf!
var c = 'fle'; // ez is egy karakteres vltoz
var d = false; // ez egy logikai vltoz
document.write('K= ',2*a*f,''); // mvelet kt szmtpussal
document.write(b ,''); // string kirsa
document.write(b+c ,''); // kt string sszefzse
document.write(d, ' ',!d,''); // logikai vltoz s ellentettje -!negls
8. plda
http://hu.wikipedia.org/wiki/Epheszoszi_H%C3%A9rakleitosz
JavaScript tananyag
8
Egy vltozval brmilyen mveletet vgezhetnk, az egszen addig megrzi rtkt, amg egy rtkad opertorral meg nem
vltoztatjuk annak tartalmt (lsd: rtkad opertorok a knyv vgn). A JS tbb rtkad opertort is ismer. A
leggyakoribb persze az egyenlsgjel. Nzzk a lehetsgeket:
var a = 42; // ez egy szm (number) tpus vltoz
var b = 5; // ez is szm
var c; // ez egy nem definilt tpus vltoz
document.write('c=', c, ''); // naugye, hogy nem definilt
document.write(a*2, ' ', a, ''); // a rtke tovbbra is 42
a = a + 1 ; // a rtkt nveld+1, gy "a" rtke=43
document.write(a, ' ', a*2, ''); // a rtke tovbbra is 43
++a; // ez is rtkad op. Jelentse: a=a+1 document.write(a, ' ', a*2, ''); // a rtke 44
document.write(++a, ''); // a rtke 45! Elszr nveli, majd kirja
document.write(a++, ''); /* a rtke 46, de 45-t r ki!
Ugyanis elszr kirja majd utna nveli a vltoz rtkt */
document.write(a, '');
--b ; // ez is rtkad opertor jelentse: b=b-1 document.write(b, ''); // b rtke 4
document.write(b--, '');
/* b=3, de 4et r ki! Elszr kirja, majd utna nveli a vltoz rtkt */
document.write(--a * ++b, ''); // Ez mennyi lesz ???
a=a+b; // a vltoz j rtket kap
a += b; // ez ugyanaz az utasts: a= a+b c=2;
c-=a; // c = c-a
document.write(c, ''); // ki tudod fejben szmolni?
9. plda
Teht az a=a+1, valamint a ++a utasts ugyanaz, csupn knyelmesebb, gyorsabb lerni az utbbit. Gyakran van
szksg egy vltoz rtknek nvelsre, cskkentsre, ezrt kapott kln opertort ez a kifejezs.
http://hu.wikipedia.org/wiki/42_(sz%C3%A1m)
JavaScript tananyag
9
4. lecke Jaj! Valami rdg vagy ha nem, ht kisnyl.., avagy felttelek a programban
Egy derk holland matematikus (kimondhatatlan a neve:-) szerint a strukturlt programok hrom vezrlszerkezetbl plnek
fel: szekvencia (utastsok egyms utni vgrehajtsa), szelekci (feltteles elgazs) s iterci (feltteles
utasts-ismtls). Eddigi programunkban csak szekvencikat hasznltunk, most a szelekci kvetkezik.
Dntsk el egy szmrl, hogy pros, vagy pratlan! A kirtkelstl fggen rjuk ki a pros, vagy pratlan
szveget. (Egy szm pros, ha kettvel osztva a maradk = 0)
var a = 42; // ez egy szm (number) tpus vltoz
if (a % 2 == 0) { // a zrjelen bell egy logikai llts document.write(a, ' szm pros'); // akkor fut le, ha az llts IGAZ
} // itt van vge a felttelnek
10. plda
Az if utasts utn zrjelben egy olyan lltst kell megadnunk, amelynek logikai eredmnye lesz (igaz/hamis). Az
a % 2 mvelet utn ll == jelentse: egyenl-e? Ne keverjk ssze az = jellel, amely rtkadst takar. Ez egy
krds, amely igaz, vagy hamis (lsd: relcis opertorok fggelk). A felttel utn rt { }" jelek kz rt utastsok
akkor futnak le, ha a felttel igaz, ellenkez esetben a fordt tugorja a blokkot (a kapcsos zrjel kz tett rszt). A
vltoz rtkt pratlanra mdostva a mintaprogram nem r ki semmit. Oldjuk meg a pratlan rtk felismerst:
var a = 42; // szm tpus vltoz
if (a % 2 == 0) { // logikai llts
document.write(a, ' szm pros'); // akkor fut le, ha az llts IGAZ
} else { document.write(a, ' szm pratlan'); // akkor fut le, ha az llts HAMIS
} // itt van vge a felttelnek
11. plda
Az else utn rt blokkban lv utastsok akkor futnak le, ha az if utn rt fettel hamisnak bizonyult.
http://magyar-irodalom.elte.hu/sulinet/igyjo/setup/portrek/arany/csalkor.htmhttp://hu.wikipedia.org/wiki/Dijkstrahttp://hu.wikipedia.org/wiki/Struktur%C3%A1lt_programoz%C3%A1shttp://hu.wikipedia.org/wiki/42_(sz%C3%A1m)http://hu.wikipedia.org/wiki/42_(sz%C3%A1m)
JavaScript tananyag
10
A prompt utasts segtsgvel futsi idben krhetnk be a felhasznltl adatot.
var a = prompt('Krek egy szmot','0'); // vltoz bekrse futsi idben if (a % 2 == 0) { // logikai llts
document.write(a, ' szm pros'); // akkor fut le, ha az llts IGAZ
} else {
document.write(a, ' szm pratlan'); // akkor fut le, ha az llts HAMIS
} // itt van vge a felttelnek
12. plda
A programozk munkjnak jelents rszt teszi ki a felhasznltl kapott adatok helyessgnek ellenrzse. Magyarul
olyan program rsa, amelyet nem lehet hibsan megadott adatokkal tnkretenni. Ha a beviteli mezbe szm helyett
stringet runk be, akkor a program szerint ez pratlan. A helyes megolds az lenne, ha elszr ellenriznnk, hogy
szmot rt-e be a kedves felhasznl!
var a = prompt('Krek egy szmot','0'); // vltoz bekrse futsi idben
if (isFinite(a)) { // ha "a" szm tpus, akkor if (a % 2 == 0) { // ha "a" osztat kettvel, akkor
document.write(a, ' szm pros'); // akkor fut le, ha az llts IGAZ
} else {
document.write(a, ' szm pratlan');// ha az llts HAMIS
} // vge a pros/pratlan felttelnek
} else { // ha nem szmot rt be
document.write(a, ' NEM SZM!');
} // vge a felttelnek
13. plda
JavaScript tananyag
11
Az isFinite() fggvny (lsd: fggelk globlis fggvnyek) logikai igaz rtket ad vissza, ha a paramtere szm tpus.
Korltozzuk a bekrt szmot egsz szmra (nem egsz szmok esetn nem sok rtelme van a pros/pratlan
fogalomnak).
var a = prompt('Krek egy egsz szmot','0'); // vltoz bekrse futsi idben
if (isFinite(a)) { // ha "a" szm tpus, akkor
if (Math.floor(a)==a) { // ha egsz szm, akkor if (a % 2 == 0) { // ha "a" oszthat kettvel
document.write(a, ' pros'); // akkor fut le, ha az llts IGAZ
} else {
document.write(a, ' pratlan'); // ha az llts HAMIS
} // vge a pros/pratlan felttelnek
} else { // ha nem szmot rt be
document.write(a, ' NEM EGSZ!'); } // ha nem egsz szmot rt be
} else {
document.write(a, ' NEM SZM!');
} // vge a felttelnek
14. plda
A Math.floor() fggvny (lsd: fggelk Math objektum) a paramterknt kapott szm egszrszt adja vissza. Egy
szm pedig nem egyenl az egszrszvel, ha a szm nem egsz (48.8 != 48).
JavaScript tananyag
12
5. lecke sszetett felttelek s logikai lltsok
Krjnk be a felhasznltl egy 100-nl nagyobb pros szmot:
var a = prompt('Krek egy 100-nl nagyobb pros szmot','0');// vltoz bekrse
if (a % 2 == 0) {
if (a > 100) {
document.write(a, ' OK');
}
}
15. plda
Az eddig tanult begyazott if segtsgvel a feladat knnyedn megoldhat. rjuk le egyetlen if-fel a felttelt:
var a = prompt('Krek egy 100-nl nagyobb pros szmot','0');// vltoz bekrse
if (a % 2 == 0 && a > 100) { // ha "a" pros S nagyobb mint 100, akkor document.write(a, ' OK');
} else {
document.write(a, ' NEM OK');
}
16. plda
Az && jel az S logikai mveletet jelenti (lsd: fggelk logikai opertorok),
amely akkor igaz, ha mindkt felttel igaz. Teht hiba lesz igaz az egyik
logikai llts, ha a msik hamis, akkor az egsz llts hamis lesz.
A B A && B
H H H
H I H
I H H
I I I
Az || jel a VAGY logikai mveletet jelenti, amely akkor igaz, ha mr az egyik
llts igaz. Prbljuk ki a programot VAGY opertorral is. Elfogadja a 6-os, a
101-es, a 120-as szmot, de a 7-es mr nem j. Mirt?
A B A || B
H H H
H I I
I H I
I I I
http://hu.wikipedia.org/wiki/Boole-algebra_(informatika)
JavaScript tananyag
13
Krjnk be kettvel, vagy httel oszthat 100-nl nagyobb szmot.
var a = prompt('Krek 2-vel,vagy 7-el oszthat 100-nl nagyobb szmot','0');
if (a % 2 == 0 || a%2 == 7 && a > 100) {
document.write(a, ' OK');
} else {
document.write(a, ' NEM OK');
}
17. plda
gy mkdik, ahogy szerettk volna? Hopp, elfogadja a kettt, holott nem nagyobb szznl! Hogyan lehetsges? A
vlasz az, hogy a logikai mveletek ugyangy nem a bert sorrendben hajtdnak vgre, mint a hagyomnyos algebrai
mveletek: 15+2*42. Elszr a 2*42 mveletet kell elvgezni.
Teht az a%2 ==0 VAGY a %7==0 S a > 100 esetn elszr az a %7==0 S a > 100 mvelet rtkeldik ki.
Programunk teht 7-tel oszthat 100-nl nagyobb szmokat VAGY brmely kettvel oszthatt elfogad.
Mi a megolds? : (15+2)*42. Bizony, a zrjel segtsgvel mr mi szablyozhatjuk a mveletvgzs sorrendjt.
var a = prompt('Krek 2-vel,vagy 7-el oszthat 100-nl nagyobb szmot','0');
if ( (a % 2 == 0 || a%2 == 7) && a > 100) { document.write(a, ' OK');
} else {
document.write(a, ' NEM OK');
}
18. plda
JavaScript tananyag
14
Most fordtsuk meg az eredeti logikai felttelt: Olyan kettvel s httel sem oszthat szmot fogadjunk el, amely 100-
nl kisebb. Bonyolultnak tnik? Pedig a megolds nem az:
var a = prompt('Krek 2-vel, s 7-el sem oszthat 100-nl kisebb szmot','0');
if (!((a % 2 == 0 || a%2 == 7) && a > 100)) { document.write(a, ' OK');
} else {
document.write(a, ' NEM OK');
}
19. plda
A felkiltjel a logikai tagads jele. Az elz feladat logikai lltsnak rtkt
fordtottuk meg. A tagadst a programozk neglsnak hvjk (a nem programozk
nem hvjk neglsnak). A negls mvelet igazsgtblja a kvetkez:
A !A
H I
I H
(Persze van ms megolds is sszetett logikai mveletek neglsra, amelyhez a de Morgan azonossgokra van szksgnk de errl majd
ksbb.)
http://hu.wikipedia.org/wiki/De_Morgan-azonoss%C3%A1gok
JavaScript tananyag
15
6. lecke "Egy, megrett a meggy, kett, csipkebokor vessz", avagy a szmll ciklus
Szmoljunk el 0-tl 20-ig, s az rtkeket jelentsk meg:
for (i=0; i =0; --i) {
document.write(i, '');
}
22. plda
JavaScript tananyag
16
Keressk meg 1 s 100 kztt az sszes httel oszthat szmot
for (i=1; i
JavaScript tananyag
17
Adjuk ssze 1 s 100 kztt a szmokat. Mennyi az eredmny? Az algoritmus neve: az "sszegzs ttele".
var szum = 0; // Ebben a vltozban szmoljuk meg a mennyisget
for (i=1; i
JavaScript tananyag
18
7. lecke "Elbb lvnk, aztn krdeznk", avagy az ell- s htul tesztel ciklusok
Krjnk be a felhasznltl egy szmot. Sikertelen adatbevitel esetn (nem szmot adott meg) ismteljk meg jra s
jra az adatbekrst.
Az ltszik, hogy a feladat ciklussal oldhat meg. Azonban a szmll ciklus erre alkalmatlan, mivel nem egyrtelm,
hogy hnyszor fogja elrontani a felhasznl az adatbevitelt (valszn, hogy elsre sikerl neki). j ciklus-szervez
utastssal kell megismerkednnk: A while ciklussal.
var n; // a vltoznak mg nincs rtke (gy tpusa sincs)
while (!isFinite(n)) { // addig ismtldjn a ciklus, amg "n" nem szm tpus n = prompt('Krek egy szmot','0');
}
document.write('A megadott szm=', n);
28. plda
A while ugyangy mkdik, mint az if utasts, azzal a klnbsggel, hogy a ciklusmagban (a kapcsos zrjelek kzti
rszben) rt utastsokat jra s jra ismtli, addig, amg a logikai llts igaz. Mi trtnik akkor, ha az llts mindig
igaz marad? Akkor rtunk egy vgtelen ciklust. Ebbl logikusan kvetkezik az, hogy a ciklusmagban kell lennie legalbb
egy utastsnak, amely ezt a felttelt megvltoztatja. (Amikor egy szmtgprl megllaptjuk, hogy az lefagyott, akkor
valjban a gpen fut programok kzl valamelyik vgtelen ciklusba kerlt, amibl tbb nem tud kikeveredni.)
Az elz programon hajtsunk vgre egy pici mdostst:
var n=42; // a vltoznak VAN rtke s az szm tpus
while (!isFinite(n)) {
n = prompt('Krek egy szmot','0');
}
document.write('A megadott szm=', n);
29. plda
JavaScript tananyag
19
Nocsak, elromlott a program! Mirt nem kr be adatot? Mirt rja ki kapsbl, hogy a megadott szm=42? Nem romlott
el semmi. Olvassuk csak ki a megadott felttelt: "Addig ismtldjn a ciklus, amg n nem szm tpus". Ez trtnt. Mr
az els futs eltt szm tpus volt, gy a ciklus egyszer sem futott le (mondtam, hogy olyan mint az if utasts) Ezt a
ciklus szerkezetet ell tesztel ciklusnak hvjuk.
Akkor biztos van htul tesztel is. Van. me:
var n=42; // a vltoznak VAN rtke s az szm tpus
do { // ciklus kezdete. Nincs felttel. n = prompt('Krek egy szmot','0');
} while (!isFinite(n)); // a vgn rtkel, hogy kell-e ismtelnie document.write('A megadott szm=', n);
30. plda
gy mr bekri a szmot a program, mg akkor is, ha adtunk meg kezdrtket. A ciklus a vgn tesztel, teht ezzel a
megoldssal a ciklus tartalma egyszer mindenkppen lefut.
sszefoglalva, az ell- s htul tesztel ciklus kzt a lnyegi klnbsg, hogy az elbbi "0 s vgtelen", az utbbi "1 s
vgtelen" kztt futtatja a ciklusmagot.
Ksztsk el jra a 14. plda feladatt. A cl egy pozitv egsz szm bekrse a felhasznltl. Most viszont ciklus
segtsgvel rjuk meg. Teht jra s jra megjelenik a prbeszd ablak, addig, amg a felhasznl minden felttelnek
megfelel szmot nem ad meg (programozsi pldkban gyakori feladat a felhasznl ltal megadott adatok
ellenrzse). A feladatot htul tesztel ciklussal oldjuk meg (termszetesen ell tesztelssel is megoldhat: lsd: 28.
plda).
JavaScript tananyag
20
var n=0;
var ok = false; // logikai vltoz
do {
n = prompt('Krek egy pozitv egsz szmot','0');
if (isFinite(n)) {
if (Math.floor(n) == n){
if (n > 0) {
ok = true;}}}
} while (!ok); // addig ismtel, amg nem ok!
document.write('A megadott szm=', n);
31. plda
Most oldjuk meg egyetlen "if"-el. Tudjuk, hogy az egymsba gyazott felttelek logikai S mvelettel is
megoldhatak. Teht
var n=0;
var ok = false; // logikai vltoz
do {
n = prompt('Krek egy pozitv egsz szmot','0');
if (isFinite(n) && Math.floor(n)==n && n > 0) {ok = true;}
} while (!ok); // addig ismtel, amg nem ok!
document.write('A megadott szm=', n);
32. plda
Oldjuk meg "if" nlkl.
var n=0;
var ok = false; // logikai vltoz
do {
n = prompt('Krek egy pozitv egsz szmot','0');
ok = (isFinite(n) && Math.floor(n)==n && n > 0); // logikai kifejezs } while (!ok); // addig ismtel, amg nem ok!
document.write('A megadott szm=', n);
33. plda
JavaScript tananyag
21
Kvetkez programunk egy szmra fog "gondolni". A mi feladatunk az, hogy a gp ltal gondolt szmot kitalljuk.
Minden programozsi nyelvben megtallhat a "vletlen szm" elllt fggvny, amely 0..1 intervallumban vlaszt
egy szmot. Ezt az rtket egy kis szmtani bvszkeds segtsgvel tetszleges intervallumra kiterjeszthetjk.
var n = Math.floor(Math.random()*100)+1; var tipp = 0;
var szoveg = 'Gondoltam egy szmot. Tipp?';
do {
tipp = prompt(szoveg, tipp);
if (tipp > n) { szoveg = 'Kisebb!';}
if (tipp < n) { szoveg = 'Nagyobb';}
} while (n != tipp);
document.write('Gratula!....');
34. plda
Hogyan lehetne ezt a programot megfordtani? Azaz mi gondolunk egy szmra s gp prblja kitallni az ltalunk
gondolt szmot.
JavaScript tananyag
22
8. lecke Matematikai algoritmusok
Prmszm keres algoritmus
Dntsk el egy pozitv egsz szmrl, hogy prmszm e! Bizony nem is olyan egyszer erre a feladatra megfelelen
hatkony algoritmust rni. Els prblkozsunk, hogy elosszuk a vizsglt szmot 2 s a szm fele kzti sszes
szmmal. Ha tallt osztt (n%i==0), akkor a szm nem prm. (Most szmtpus ellenrzst nem tartalmaz a kd)
var n = prompt('Krek egy szmot!',0);
var veg = Math.floor(n/2); // szm felnek egszrsze
var prim_e = true;
var i = 2;
while (i
JavaScript tananyag
23
Listzzuk ki 21000 intervallumban az sszes prmszmot.
for (n = 2; n
JavaScript tananyag
24
Legnagyobb kzs oszt (LNKO)
Mennyi 2340 s 1092 legnagyobb kzs osztja? Tbb megolds is ltezik a feladat megoldsra. Az egyik, hogy
bontsuk fel mindkt szmot prmtnyezire. Az LNKO pedig a kzs prmek szorzata a legnagyobb hatvnyon.
Plda: 2340 = 2*2*3*3*5*13; 1092= 2*2*3*7*13; Teht az LNKO = 2*2*3*13 = 156.
Ezt a megoldst jelenlegi ismereteinkkel nem tudjuk leprogramozni, hiszen trolni kell a prmeket (jelenleg nem
troljuk, csak egy vltoz aktulis llapott rjuk ki.) Helyette alkalmazzuk az un Euklideszi algoritmust: Osszuk el a
nagyobb szmot a kisebbel! Az oszts maradkval osszuk el a kisebb szmot. A tovbbiakban az osztt osztom a
maradkkal eljrst addig ismtlem amg 0 maradkot kapok. Az utols 0-tl klnbz maradk a legnagyobb
kzs oszt.
var a = 2340; // nagyobb szm
var b = 1092; // kisebb szm
var m = 0 ;
do { // htultesztel ciklus
m = a % b; // m = az oszts maradka
a = b;
b = m;
} while (m != 0) ; // addig fut, amg a maradk nem egyenl nulla
document.write('LNKO=',a);
38. plda
Mdosuk gy a programot, hogy "a", s "b" vltoz rtkt a felhasznl adja meg. (Arra is gyelni kell, hogy "a"
vltozba a kisebb,"b" vltozba a nagyobb rtk kerljn.
http://hu.wikipedia.org/wiki/Legnagyobb_k%C3%B6z%C3%B6s_oszt%C3%B3http://hu.wikipedia.org/wiki/Euklideszi_algoritmus
JavaScript tananyag
25
Legkisebb kzs tbbszrs (LKKT)
Kt szm szorzata egyenl legnagyobb kzs osztjuk, s legkisebb kzs tbbszrsk szorzatval.
LNKO(a,b) * LKKT(a,b) = a*b
Ez hatkony mdszert ad a legkisebb kzs tbbszrs meghatrozsra, mivel elg meghatrozni a legnagyobb kzs osztt,
sszeszorozni a kt szmot, majd a szorzatot elosztani a legnagyobb kzs osztval.
Mdosuk az elz programot gy, hogy kirja az "LKKT"-t is. Figyelem: "a", s "b" vltoz rtke mdosul a
programfuts alatt, gy rdemes a program elejn a kt vltozt sszeszorozni s trolni.
Hromszg terletnek szmtsa hrom oldalbl
var a = Number(prompt('-A- oldal',0)); // a Number fggvny szmm alaktja
var b = Number(prompt('-B- oldal',0));
var c = Number(prompt('-C- oldal',0));
if (a+b>c && b+c>a && a+c>b ) { // ha brmely kt oldal sszege nagyobb
var k = a+b+c;
var s = k/2;
var t = Math.sqrt(s*(s-a)*(s-b)*(s-c)); // by Heron
document.write('Kerlet=',k,' cm');
document.write('Terlet=',t,' cm2');
if (a*a+b*b==c*c || a*a+c*c==b*b || b*b+c*c==a*a) {
document.write('A hromszg derkszg');
}
} else {
document.write('NEM szerkeszthet hromszg');
}
39. plda
http://hu.wikipedia.org/wiki/Legkisebb_k%C3%B6z%C3%B6s_t%C3%B6bbsz%C3%B6r%C3%B6shttp://hu.wikipedia.org/wiki/H%C3%A9r%C3%B3n-k%C3%A9plet
JavaScript tananyag
26
Szgfggvnyek szmtsa
Hatrozzuk meg 0 ..360 kztt az sszes egsz fok sinust, cosinust, tangenst, cotangenst.
for (i = 0; i
JavaScript tananyag
27
9. lecke Karakterlnc tpusok
A karakterlnc tpus ASCII karakterek sorozata. A vltoz rtkt aposztfok kz zrva kell megadni. pl gy:
var s1 = 'Almspite'; // gy egyszerbb
var s2 = new String('Almspite'); // viszont gy javasolt megadni
var s3 = new String(''); // Ez egy res string
var s4 = new String; // .ez is
41. plda
rjuk ki a felhasznltl bekrt stringet karakterenknt, egyms al.
var s = new String;
s = prompt('rd be a neved');
document.write('Szia ',s,''); // .udvariasan ksznnk
document.write('A neved ',s.length,' karakterbl ll.'); // string hossza
for (i=0; i < s.length; ++i) { // string els karaktere a nulladik elem!
document.write(s.charAt(i),'');
}
42. plda
Nzzk meg alaposan a for ciklus paramtereit. A stringet nulltl kezdjk el olvasni. Jegyezzk meg a string els karaktere a
nulladik. A karakterlnc olvasst pedig a hossz eltt egyel (i < s.length) hagyjuk abba. Egy 5 karakter hossz string olvassa
teht 0-tl ngyig tart. A bekrt nevet rassuk ki visszafel (most egy sorban jelenjen meg, gy nem kell sortrs)
var s = new String;
s = prompt('rd be a neved');
for (i =s.length-1; i>=0 ; --i) { // string els karaktere a nulladik elem!
document.write(s.charAt(i)); }
43. plda
A visszafel szmll for ciklus a 22. pldban mr szerepelt.
http://hu.wikipedia.org/wiki/Stringhttp://hu.wikipedia.org/wiki/ASCIIhttp://www.nosalty.hu/recept/almaspite
JavaScript tananyag
28
Ahogy kt numerikus tpust is ssze tudtunk hasonltani, gy karakteres tpusok is sszehasonlthatak. Azonban gyelnnk kell
arra, hogy ha a karaktert s=new String formban definiltuk, akkor az sszehasonltsnl az s.valueOf() alapjn kell
hasonltanunk.
var s1 = new String('Alma'); // string objektum
var s2 = new String('Krte');
var sA = s1.valueOf(); // String primitv = a string objektum rtke
var sB = s2.valueOf();
if (sA > sB) { document.write('s1 nagyobb'); }
if (sA < sB) { document.write('s2 nagyobb'); }
if (sA == sB) { document.write('s1 = s2 '); }
44. plda
Karakterlncok esetn a nagyobb / kisebb fogalom elsre furcsa lehet, de csupn szoros ABC sorrendrl van sz (ASCII kdtbla
alapjn). Figyelnnk kell arra is hogy kis/nagybet nagyon nem ugyanaz.
Prbljunk klnbz rtkeket adni s1, s2 vltozknak, s figyeljk az sszehasonltst!
A kvetkez pldaprogram az ASCII kdtbla rtkeit jelenti meg. A 32 eltti rtkek nem jelennek meg, mert vezrl karakterek.
(A 32 sem, mert az pedig a szkz ami ugyanolyan karakter, mint brmely bet).
for (i = 32; i
JavaScript tananyag
29
var s = new String('rvztr tkrfrgp');
// string kirsa nagybets alakban
document.write(s.toUpperCase(),'');
// string kirsa kisbets alakban
document.write(s.toLowerCase(),'');
// string rszlet kivgsa els paramter: kezd pozci; msodik: hossz
document.write(s.substr(10,5),'');
document.write(s.substr(15,4),'');
// keress a stringben (els elforduls) . ha nincs, akkor -1 et ad vissza
document.write(s.indexOf('tkr'),'');
// keress a stringben (utols elforduls) visszafel keres
document.write(s.lastIndexOf('r'),'');
var nev = prompt('Krem a teljes neved!');
// szkz utni karakter pozici
var i = nev.lastIndexOf(' ')+1;
document.write('Szia ',nev.substr(i),'!') ;
// rjuk ki a vezetknevet nagybets alakban
document.write(nev.substr(0,i).toUpperCase(),'');
46. plda
JavaScript tananyag
30
Titkost algoritmusok
Feladatunk egy string tartalmnak titkostsa. Persze nagyon egyszer titkosts lesz. Ennl egyszerbb titkosts nem is ltezik. A
program a string minden egyes karakternek ASCII kdjhoz hozzad egy konstans rtket (kulcs), majd a kapott szmot
visszavltja karakterr. A karaktersort a "titkos" nev vltozba gyjti. Az algoritmust Caesar kdnak nevezik.
var nyilt = new String('Almspite');
var titkos = new String('');
var kulcs = 1; // jelsz
for (i=0; i < nyilt.length; ++i) {
var a = nyilt.charCodeAt(i)+kulcs; // i. pozici ASCII kdja + kulcs
var k = String.fromCharCode(a); // ASCII kd visszaalaktsa karakterre
titkos += k; // titkos = titkos + k
}
document.write('nylt szveg: ',nyilt,'titkos szveg: ',titkos);
47. plda
Milyen lehetsgeink vannak az gy rejtjelezett szveg visszafejtsre?
A Vigenere kd
Majd jvre
http://hu.wikipedia.org/wiki/Titkos%C3%ADr%C3%A1shttp://hu.wikipedia.org/wiki/Caesar-rejtjel
JavaScript tananyag
31
10. lecke Fggvnyek, eljrsok
A cmben szerepl kifejezs most nem egy algoritmust takar, hanem egy programozsi struktrt, amely nlkl lehetetlen
nagyobb s sszetettebb programokat rni. Ezt a szerkezetet olyan programrszletekhez tudjuk felhasznlni, amelyek gyakran
ismtldnek. gy nevk segtsgvel brmikor meg tudjuk hvni.
function eljaras1 (s) { // eljrs neve, paramter
document.write(s,'');
}
function eljaras2() {
var i;
for (i=0; i < nyilt.length; ++i) {
document.write(i,'.sor'); }
}
var i = 1; // itt kezddik a program
eljaras1('almspite'); // eljrs meghvsa, paramter tadssal
eljaras1('pecsenyekacsa');
48. plda
A pldban szerepl eljaras1 eljrst ktszer is meghvjuk, mg az eljaras2 egyszer sem fut le.
function ir (s) { // eljrs neve, paramter
document.write(s,'');
}
function negyzet (a) { // a fggvny neve, formlis paramter
var i = a*a; // loklis vltoz
return i; // fggvny visszatrsi rtke
}
var i = negyzet(2); // fggvny hvsa, aktulis paramter
ir(i);
ir(negyzet(negyzet(negyzet(i)))); // Melyik szmot fogja kirni?
49. plda
JavaScript tananyag
32
Ebben a pldaprogramban rengeteg jdonsg van, amit jl meg kell jegyeznnk. A negyzet eljrs neve: fggvny. Van
visszatrsi rtke, amelyet a return utastssal adunk meg. A fggvnyen (eljrson) bell ltrehozott vltozk kvlrl (a
fprogrambl, ms fggvnyekbl) lthatatlanok, ezeket loklis vltozknak hvjuk. lettartamuk csak a fggvny futsi idejre
terjed. Teht a fggvnyben s a fprogramban ltrehozott "i" vltozknak semmi kzk egymshoz!
rjunk fggvnyt, amely a megadott paramterek alapjn kiszmtja az elektromos vezet fajlagos ellenllst.
function ir (s) { // eljrs neve, paramter
document.write(s,'');
}
function vez_ellenallas(d, l, ro) {
var A = d*d*Math.PI/4; // a vezetk keresztmetszete mm^2
var R = ro*l/A;
return R; }
var d = 0.1; // a vezetk tmrje - mm
var l = 200; // a vezetk hossza - m
var ro = 0.0175; // a rz fajlagos ellenllsa Ohm*mm^2/m
var ohm = vez_ellenallas(d, l, ro);
ir(d+'mm tm., '+l+'m hossz rzvezetk ellenllsa='+ohm+'Ohm.');
50. plda
A fggvnynek most hrom paramtert adtunk t.
Most vizsgljuk meg a paramterknt kapott vet, hogy szkv e?
function szokoev(a) {
return ((a % 4 == 0 && a %100!=0) || a % 400 == 0);}
var ev = 2001;
var s = ' NEM ';
if (szokoev(ev)) { s = ''}
ir(ev+' v'+s+'szkv.' );
51. plda
http://hu.wikipedia.org/wiki/Sz%C3%B6k%C5%91%C3%A9v
JavaScript tananyag
33
11. lecke Bitmveletek
Bitmveleteket csak fixpontos szmbrzols szmokon szabad vgezni. (Termszetesen ehhez ismerni kell, a fixpontos,
valamint a lebegpontos szmbrzols fogalmt)
function ir (s) {
document.write(s,'');
}
var j = 12;
ir(j1) ; // Melyik szmot fogja kirni?
for (i=0; i < 31; ++i) { ir(1
JavaScript tananyag
34
function ir (s) {
document.write(s,'');
}
var j = 78; // 1001110 a 2^4 bitet fogjuk bekapcsolni
var bitmask = 1
JavaScript tananyag
35
12. lecke A tmb adatszerkezet
A tmb (array) olyan adatszerkezet, amelyet nevestett elemek csoportja alkot, melyekre sorszmukkal (indexkkel) lehet
hivatkozni. Ha a vltozt egy fikhoz hasonltottuk, akkor a tmb egy fikos szekrny.
Jegyezzk meg: A tmb els eleme a 0. elem!
A tmb utols eleme a length-1. elem!
Adott tmbelemre a tmbnv utn tett szgletes zrjelben hivatkozunk: T[3]
var ures_tomb = new Array();
var tomb = new Array('Uborka','Dinnye','Krumpli','Di','Alma','Bann');
document.write('A tmb els eleme=',tomb[0],'');
document.write('A tmb elemszma=',tomb.length,'');
document.write('A tmb utols eleme=',tomb[tomb.length-1],'');
// ------ A tmb elemeinek kirsa ------------------
for (i =0; i=0; --i) {
document.write(i,'. --->',tomb[i],'');
}
document.write('');
tomb.push('Ribizli'); // j elem beszrsa a tmb vgre (STACK!)
tomb.unshift('Mlna'); // j elem beszrsa a tmb elejre (QUEUE!)
tomb.pop(); // utols elem trlse
tomb.shift(); // els elem trlse
55. plda
A kvetkez plda egy szm hexadecimlis konvertlst mutatja be:
http://hu.wikipedia.org/wiki/T%C3%B6mbhttp://hu.wikipedia.org/wiki/Verem_(sz%C3%A1m%C3%ADt%C3%A1stechnika)
JavaScript tananyag
36
function ir (s) {
document.write(s,'');}
function hexa(a) {
var eredmeny = '';
var szamjegyek=new Array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F');
while (a!=0) {
eredmeny = szamjegyek[a%16] + eredmeny;
a = parseInt(a/16); }
return eredmeny; }
ir(hexa(282));
56. plda
A tmbkezels tovbbi algoritmusai, mint programozsi alapttelek kerlnek ismertetsre. Mindegyik programban egy
vletlenszmokkal feltlttt tmbbel fogunk dolgozni. Az itt megadott fggvnyeket gy mindegyik program elejre be kell msolni.
function ir (s) {document.write(s,'');}
// "a" tmbt "elemszam" darab vletlen rtkkel tlt fel "minvel" "maxvel" kzt
function tombFeltolt(a, elemszam, minvel, maxvel) {
var intervallum = maxvel-minvel;
for (i=0; i< elemszam; ++i) {
a[i]=Math.round(Math.random()*intervallum)+minvel;}
return a; }
}
// "a" tmbt rtkeit s pozci szmt (indext) rja ki
function tombKiir(a) {
for (i=0; i< a.length; ++i) {
document.write('(',i,'.)',a[i],', ');}
}
57. plda
JavaScript tananyag
37
Tmb elemeinek legkisebb, legnagyobb eleme (minimum, maximum kivlaszts ttele)
Keressk meg a tmb legnagyobb s legkisebb elemt (A program elejre az elz plda fggvnyeit be kell msolni!)
var tomb = new Array();
tomb = tombFeltolt(tomb, 100, 1, 1000); // 100 elem tmb, 1..1000 kzti szmokkal
tombKiir(tomb);
// -----maximum elem kivlaszts ttele -----
var max = tomb[0]; // ttelezzk fel, hogy a tmb els eleme a legnagyobb
var poz = 0; // ebben a vltozban a pozicit troljuk (indexet)
for (i =0; imax) { max = tomb[i]; poz = i;}
}
ir('Legnagyobb elem: '+max+', a '+poz+'. pozicin.');
// -----minimum elem kivlaszts ttele -----
var min = tomb[0]; // ttelezzk fel, hogy a tmb els eleme a legkisebb
var poz = 0;
for (i =0; i
JavaScript tananyag
38
Tmb elemeinek sszege, tlaga (megszmlls, sszegzs ttele)
Szmtsuk ki a tmb elemeinek sszegt s szmtani tlagt. (A programok elejre az 57. plda fggvnyeit be kell msolni!)
var tomb = new Array();
tomb = tombFeltolt(tomb, 100, 1, 1000); // 100 elem tmb, 1..1000 kzti szmokkal
tombKiir(tomb);
var szum = 0;
for (i=0; i< tomb.length; ++i) {
szum = szum + tomb[i];
}
ir('A tmb elemeinek sszege '+szum) ;
ir('A tmb elemeinek tlaga '+szum/tomb.length);
59. plda
Az tlagszmts algoritmusban oszts van. Osztskor mindig meg kell vizsglni, hogy a nevezben lv vltoz nem nulla?
Pldnkban nulla elem tmb esetn a program hibazenettel lellna.
Szekvencilis keress a tmbben
Feladatunk egy adott rtk keresse a tmbben. Kt eset lehetsges: az rtk tbbszr, vagy csak egyszer fordul-e el a
tmbben? Ha tbbszr is elfordulhat a keresett rtk, akkor egyszer a feladat: vgig kell olvasni a tmbt s a felttelnek
megfelel rtkek pozcijt ki kell rni (A programok elejre az 57. plda fggvnyeit be kell msolni!)
var tomb = new Array();
tomb = tombFeltolt(tomb, 100, 1, 50); // 100 elem tmb, 1..50 kzti szmokkal
tombKiir(tomb);
var keres = 42; // ezt az rtket keressk
var talalt = false; // tallatot jelz logikai vltoz
for (i=0; i< tomb.length; ++i) {
if (keres == tomb[i]) {
ir('Tallat a(z) '+i+'. pozicin');
talalt = true; } }
if (!talalt) {ir(' Nincs '+keres+' a tmbben.');}
60. plda
JavaScript tananyag
39
A feladat sszetettebb, ha csak egy tallat lehetsges, mivel ekkor le kell lltani a keresst. Teht a "for" ciklus nem alkalmas a
feladatra. Ell tesztel ciklust hasznlunk, amely "addig fut, amg vgig nem olvastuk a tmbt s nincs tallat".
var tomb = new Array();
tomb = tombFeltolt(tomb, 100, 1, 50); // 100 elem tmb, 1..50 kzti szmokkal
tombKiir(tomb);
var talalt = false;
var keres = 42;
var i = 0;
while (i++ < tomb.length && !talalt) { // ..amg nincs vge a tmbnek s nincs tallat
talalt = (keres == tomb[i]); // a zrjelben lv mvelet eredmnye logikai tpus
}
if (talalt) { ir('Tallat a '+(i-1)+' pozicin.');}
else { ir(' Nincs '+keres+ ' a tmbben.'); }
61. plda
Mirt az (i-1) pozcin van tallat s mirt nem az "i"- pozcin?
Cserljk le a ciklus-felttel sort a kvetkezre:
while (!(i++ >= tomb.length || talalt)) { // .amg nincs vge a tmbnek s nincs tallat
Mkdik? Mkdik. Mirt? A vlasz a mr emltett de Morgan azonossg.
A logikai kifejezsek kztt igaz a kvetkez kt azonossg: !A s !B = !(A vagy B) valamint !A vagy !B = !(A s B)
Prbljuk a kt logikai felttelt megfeleltetni a "while" utn ll logikai kifejezseknek!
A szekvencilis (soros) keressnek tlagosan "elemszm DIV 2" elemet kell vgignznie, hogy tallat legyen. (Nha szerencsnk
van s megtallja elsre, nha pech s az utols rekord lesz a tallat.) Ennl hatkonyabb keress lesz majd a binris keress.
http://hu.wikipedia.org/wiki/De_Morgan-azonoss%C3%A1gok
JavaScript tananyag
40
Karakteres tpus adatok keresse a tmbben
Ha pontos egyezsre keresnk, akkor nincs lnyeges klnbsg. A html forrs elejre szerkesszk be a kvetkez sort:
// A tbb mint 2000 teleplst tartalmaz fjl megtallhat a doksi mappjban "j2.zip" nven
var keres = 'Zalaegerszeg';
for (i=0; i < telepulesTb.length; ++i) {
if (keres == telepulesTb[i]) {
ir(i+' --> '+telepulesTb[i]); }
}
62. plda
Szpen mkdik, de karakteres adatok keressnl elvrjuk a csonkolt keresst. Teht a keres="Zala" kifejezsre nincs tallat.
Alaktsuk t gy a programot, hogy megtallja a "Zala"-val kezdd teleplseket. A megolds, hogy a vizsglt elemet olyan
hosszan hasonltjuk ssze, amilyen hossz a keres stringben lv kifejezs.
if (keres == telepulesTb[i].substr(0,keres.length)) {
Karakteres adatoknl clszer, hogy nem tesznk klnbsget a kisbetk s nagybetk kztt. A megolds hogy mind a keres
vltozban lv rtket, mind a vizsglt elemet nagybetsre (vagy kisbetsre, lnyeg, hogy egyforma legyen) konvertljuk s gy
hasonltjuk ssze.
if (keres toUpperCase() == telepulesTb[i].substr(0,keres.length).toUpperCase()) {
JavaScript tananyag
41
Tmb elemeinek rendezse (buborkos rendezs)
var tomb = new Array();
tomb = tombFeltolt(tomb, 100, 1, 50); // 100 elem tmb, 1..50 kzti szmokkal
tombKiir(tomb);
var csere = 0;
var volt_csere = true;
while (volt_csere) {
volt_csere = false;
for (i=0; i< tomb.length-1; ++i) {
if (tomb[i] > tomb[i+1]) { // ha nagyobb, akkor csere
volt_csere= true;
csere = tomb[i];
tomb[i] = tomb[i+1];
tomb[i+1] = csere;
}
}
}
ir('rendezett lista:');
tombKiir(tomb);
ir('A tmb legkisebb eleme: '+tomb[0]);
ir('A tmb legnagyobb eleme: '+tomb[tomb.length-1]);
63. plda
Tmb elemeinek rendezse (minimum, maximum elem kivlasztsos rendezs)
JavaScript tananyag
42
Binris keress a tmbben (logaritmikus keress ttele)
Szekvencilis keressnl tlagosan "elemszm DIV 2" rtket kell megvizsglni, hogy megtalljuk a kvnt elemet (nha
szerencsnk van, elsre megtallja, nha pech s az utols elem a keresett). A binris keress ennl jobb hatsfokkal keres,
viszont elfelttele a rendezett adathalmaz. Az algoritmus menete a kvetkez:
1. tegyk be egy vltozba a tmb els elemnek indexpozcijt ( els = 0)
2. tegyk be egy vltozba a tmb utols elemnek indexpozcijt ( utols = tomb.length-1)
3. indtsunk egy htul tesztels ciklust
4. kzps = els + utols DIV 2
5. Ha a keresett rtk kisebb mint a tmb[kzps] eleme , akkor els = kzps
6. Ha a keresett rtk nagyobb mint a tmb[kzps] eleme , akkor utols = kzp
7. A ciklus addig fut, amg meg nem talltuk, s nem "r ssze" az els s az utols vltoz rtke
Lthat, hogy gy minden egyes cikluskr utn az elz
tmbmret fele marad csak. gy igen nagy sebessggel
"elfogy" a tmb.
Mekkora ez a sebessg? Ttelezzk fel hogy tmbnk
pont 1024 elem, ekkor a tzedik keressre "elfogy" a
tmb. 210 = 1024, teht ha az adathalmaz elemszma
N, akkor maximum log2 N keressre biztosan vget r
a keress. gy ez az rtk is megadhat a ciklus lellsi
felttelnek.
Hny elemet vizsgl meg az eljrs egymilli s
egymillird rekord esetn?
JavaScript tananyag
43
A html forrs elejre szerkesszk be a kvetkez sort:
// A tbb mint 2000 teleplst tartalmaz fjl megtallhat a doksi mappjban "j2.zip" nven
// A binris keresshez rendezett tmbre van szksg !
var csere = 0;
var volt_csere = true;
while (volt_csere) {
volt_csere = false;
for (i=0; i< telepulesTb.length-1; ++i) {
if (telepulesTb[i] > telepulesTb[i+1]) { // ha nagyobb, akkor csere
volt_csere= true;
csere = telepulesTb[i];
telepulesTb[i] = telepulesTb[i+1];
telepulesTb[i+1] = csere;
}
}
}
// ---- binris keress ----
var keres = 'Pcs'; var elso = 0;
var utolso = telepulesTb.length-1;
var i = 0;
var leall = parseInt(Math.log(telepulesTb.length)/Math.log(2))+1;
// =log2(rekordszm) ennyi cikluskr lehet maximum
do {
var kozep = parseInt((elso + utolso) / 2);
if (keres < telepulesTb[kozep]) { utolso = kozep; }
if (keres > telepulesTb[kozep]) { elso = kozep; }
} while ( keres != telepulesTb[kozep] && i++ < leall );
if (i > leall) { ir('Nincs tallat.'); }
else { ir('Tallat a '+kozep+' pozicin.');}
64. plda
JavaScript tananyag
44
Minden eddig tanult ismereteink sszefoglalja kvetkezik: Ksztsnk rknaptrt. (A JS-ben ugyan van dtum tpus vltoz,
de mi most matematikai s csillagszati mdszerekkel hatrozzuk meg, hogy a megadott dtum mely napra esik.) Kiindulsi
dtumunk 1900.01.01, amely vasrnap volt (tuti). Kiszmtjuk, hny nap telt el azta, majd osztjuk httel s a maradkot (0..6)
vizsgljuk. Ha nulla marad, akkor jra vasrnap van, ha egy, akkor htf.
var hetnapjaTb = new
Array('vasrnap','htf','kedd','szerda','cstrtk','pntek','szombat');
var hoNapjaTb = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
//---------------------
function szokoev(a) { // lsd szkv fggvny: 51. plda //---------------------
var nap = 0;
if ((a % 4 == 0 && a % 100 != 0) || a % 400 == 0) { nap = 1; }
return nap;} // ha szkv, akkor 1, ha nem akkor 0
//-------------------------------
function naptar(ev, ho, nap) {
//-------------------------------
var napok = 0;
var i = 0;
for (i=1900; i < ev; ++i) { napok += 365 + szokoev(i); } // befejezett vek napjai
for (i=0; i < ho-1; ++i) { napok += hoNapjaTb[i] ; } // befejezett hnapok napjai
napok += nap; // akt. hnapbl eltelt napok
if (ho > 2 ) { napok += szokoev(ev); } // ha elmlt februr s ez az v szkv
return hetnapjaTb[ napok % 7 ]; }
//-------------------------------
document.write(naptar(2012,12,21));
65. plda
A fggvny segtsgvel ksztsk el egy adott v, hnap (pl: 2013, 05) naptrt: Irassuk ki a hnap dtumt, mell az
aktulis napot (egyetlen "for" ciklussal oldjuk meg).
JavaScript tananyag
45
Tbbdimenzis tmbk
A ktdimenzis tmb tulajdonkppen egy tblzat. A matematikusok "mtrixnak" nevezik. (A nem matematikusok nem nevezik
mtrixnak). Ez az adatszerkezet nem ms, mint egy olyan tmb amelynek elemei jabb tmbk. Legegyszerbb rtelmezse a sor-
oszlop megkzelts. A tmb feldolgozsa is gy trtnik, valamint alkalmazsa is sor-oszlop rtelmezs feladatokhoz kthet.
Klasszikus feladat, egy adott hnap rnknti hmrsklet adatainak trolsa (pl 31x24-es tmb). Ebbl az adatszerkezetbl
vlaszt kapunk olyan krdsekre, hogy:
Mennyi volt a hnap tlaghmrsklete? (teljes tmb sszests)
Mennyi volt az egyes napok tlaghmrsklete? (sorok sszestse)
Mennyi volt az egyes rk tlaghmrsklete? (oszlopok sszestse)
var tb = /* KTDIMENZIS TMB DEFINILSA */
new Array(
new Array( 9, 3, 2, 2, 3, 1, 4, 9),
new Array( 2, 5, 9, 4, 5, 7, 8, 5),
new Array( 4,10, 4, 4, 6,15, 5, 9),
new Array( 1,10, 3, 8, 2, 2, 3, 8),
new Array( 4, 3, 1, 9, 5, 8, 3, 1),
new Array( 5, 6, 5, 5, 4, 6, 8, 1),
new Array( 2, 4, 7, 5, 4, 7, 8, 2),
new Array( 0, 4, 9, 6, 2, 6, 6, 4)
);
66. plda
A ktdimenzis tmb feldolgozshoz ltalban kt egymsba gyazott- szmll ciklust alkalmazunk. Hatrozzuk meg a tmb
elemeinek sszegt s tlagt. Majd ugyangy hatrozzuk meg a sorok sszegt, tlagt; majd az oszlopok sszegt, tlagt:
JavaScript tananyag
46
// -- tmb tlaga --
var szum = 0;
for (i=0; i < tb.length; ++i) {
for (j=0; j
JavaScript tananyag
47
13. lecke Adatbekrs felhasznltl (HTML)
Eddig a felhasznli adatbekrst a "prompt" eljrssal oldottuk meg. A cl, hogy HTML rlap segtsgvel kommunikljunk a
programot alkalmazval. Ehhez tbb felttelnek is meg kell felelni:
A HTML rlap valamely esemnyre (pl: kattints egy nyomgombon) meg kell hvni egy JS eljrst
A HTML kdban rt rtket t kell adni a JS-nek.
A minta egy HTML rlapot, valamint az rlapon lv nyomgomb kattints fggvnyhvsi eljrst mutatja be. A mintafeladat
rdekessge, hogy a kirs nem a szoksos document.write segtsgvel trtnik, hanem egy res DIV tag-be r vissza.
function teszt() {
var szam1 = parseFloat(document.form1.SZAM1.value); // rtk tvtele HTML-bl!
var szam2 = parseFloat(document.form1.SZAM2.value); // parseFloat: Szm tpusra alakt!
document.getElementById('keret1').innerHTML = 'sszegk='+(szam1+szam2)+
'Klnbsgk='+(szam1-szam2)+ 'Szorzatuk='+(szam1*szam2)+
'Hnyadosuk='+(szam1/szam2)+'Hatvnyuk='+Math.pow(szam1,szam2);
return true; }
1. szm:
2. szm:
68. plda
http://www.w3schools.com/html/html_forms.asphttp://www.w3schools.com/tags/tag_div.asp
JavaScript tananyag
48
Kvetkez pldnk a "szmkitalls jtk" (34. plda) jrarsa lesz, ezzel a programozsi technikval. Hasonltsuk alaposan ssze
a kt algoritmust.
var n = Math.floor(Math.random()*1000)+1; // gy globlis lesz a vltoz
function teszt() {
var tipp = parseInt(document.form1.TIPP.value); // parseInt: Szm tpusra alakt!
var szoveg = '';
if (tipp > n) { szoveg = 'Kisebb!';}
if (tipp < n) { szoveg = 'Nagyobb';}
if (tipp ==n) { szoveg = 'TALLT'; }
document.getElementById('keret1').innerHTML = szoveg
}
Gondoltam egy szmot 1..1000 kztt.
Tipp:
69. plda
JavaScript tananyag
49
Fggelk
Vezrl szerkezetek
if (felttel) {utastsok; }
if (felttel) {utastsok; } else {utastsok; }
switch(n) {
case 1: utastsok; break; // ha n = 1
case 2: utastsok; break; // ha n = 2
default: utastsok; // n != 1 s n!= 2
}
for (vltoz=kezd rtk; felttel; ++vltoz) { utastsok; } // szmll ciklus
while (felttel) { utastsok; } // ell tesztel ciklus
do { utastsok; } while (felttel) // htul tesztel ciklus
function eljrsnv (paramterek) {
utastsok;
return visszatrsi_rtk; }
JavaScript tananyag
50
Opertorok
rtkad opertorok (x=10; y=5)
Opertor Mvelet Plda Eredmny=
+= x+=y x=x+y x=15
-= x-=y x=x-y x=5
*= x*=y x=x*y x=50
/= x/=y x=x/y x=2
%= x%=y x=x%y x=0
Aritmetikai opertorok (x = 5;)
Opertor Mvelet Plda Eredmny
+ sszeads x=y+2 x=7
- Kivons x=y-2 x=3
* Szorzs x=y*2 x=10
/ Oszts x=y/2 x=2.5
% Modulus (oszts maradka) x=y%2 x=1
++ Nvels (+1) x=++y x=6
-- Cskkents x=--y x=4
Relcis opertorok (x = 5;)
Opertor Mvelet Plda
== egyenl x==8 is false
=== egyenl s azonos tpus x===5 is true
!= nem egyenl x!=8 is true
> nagyobb x>8 is false
< kisebb x= nagyobb, vagy egyenl x>=8 is false
JavaScript tananyag
51
Logikai opertorok (x=6; y=3;)
Opertor Mvelet Plda
&& and (x < 10 && y > 1) is true
|| or (x==5 || y==5) is false
! not !(x==y) is true
Bitmvelet opertorok (x=6; y=3;)
Opertor Mvelet Plda
& a s b (bitenknti s)
| a vagy b (bitenknti vagy)
^ a xor b (bitenknti xor)
~ !a (bitengnti negls: 1. komp.)
> bitenknti jobbra tols
Globlis fggvnyek
Fggvny Mvelet Plda
isFinite(x) igaz, ha a x szm tpus isFinite("negyven") false | isFinite(40) true
isNaN(x) igaz, ha x nem szm tpus isNaN("negyven") true | isNan(40) false
Number(x) x vltozt szm tpuss alaktja (ha tudja) document.write(Number("40.5 years")) 40.5
parseFloat() x vltozt vals szmm alaktja (ha tudja) document.write(parseFloat("40.5 years")) 40.5
parseInt() x vltozt egsz szmm alaktja (ha tudja) document.write(parseInt("40.5 years")) 40
String() x vltozt stringg alaktja string(40) "40"
JavaScript tananyag
52
Beptett objektumok
A Math objektum konstansai ( Math. )
Nv Mvelet
E Az Euler szm rtkt adja (approx. 2.718)
LN2 Returns the natural logarithm of 2 (approx. 0.693)
LN10 Returns the natural logarithm of 10 (approx. 2.302)
LOG2E Returns the base-2 logarithm of E (approx. 1.442)
LOG10E Returns the base-10 logarithm of E (approx. 0.434)
PI PI rtkt adja vissza
SQRT2 Returns the square root of 2 (approx. 1.414)
A Math objektum fggvnyei ( Math. )
abs(x) Returns the absolute value of x
acos(x) ARCCOS x rtke radinban
asin(x) ARCSIN x rtke radinban
atan(x) ARCTAN x rtke radinban -PI/2 s PI/2 radin kztt
atan2(y,x) Returns the arctangent of the quotient of its arguments
ceil(x) Returns x, rounded upwards to the nearest integer
cos(x) COS x rtke radinban
exp(x) Returns the value of Ex
floor(x) X egsz rszt adja eredmnyl
log(x) Returns the natural logarithm (base E) of x
max(x,y,z,...,n) A megadott paramterek kzl a legnagyobbat adja eredmnyl.
min(x,y,z,...,n) A megadott paramterek kzl a legkisebbet adja eredmnyl.
pow(x,y) Eredmnye X az Y-adik hatvnyon
random() 0..1 intervallumban vals vletlenszmot generl
round(x) Rounds x to the nearest integer
sin(x) SIN x rtke radinban
sqrt(x) x ngyzetgykt adja eredmnyl
tan(x) TAN x rtke radinban
http://hu.wikipedia.org/wiki/Euler-f%C3%A9le_sz%C3%A1mhttp://hu.wikipedia.org/wiki/Pi_(sz%C3%A1m)http://hu.wikipedia.org/wiki/Sz%C3%B6gf%C3%BCggv%C3%A9nyekhttp://hu.wikipedia.org/wiki/Sz%C3%B6gf%C3%BCggv%C3%A9nyekhttp://hu.wikipedia.org/wiki/Sz%C3%B6gf%C3%BCggv%C3%A9nyekhttp://hu.wikipedia.org/wiki/Sz%C3%B6gf%C3%BCggv%C3%A9nyekhttp://hu.wikipedia.org/wiki/Sz%C3%B6gf%C3%BCggv%C3%A9nyekhttp://hu.wikipedia.org/wiki/Sz%C3%B6gf%C3%BCggv%C3%A9nyek
JavaScript tananyag
53
A Number objektum konstansai
var num = new Number(value);
plda: var n = new Number(314.15926);
Nv Mvelet
toExponential(x) Szm alaktsa exponencilis formtumra: 3.1415926e+2
toFixed(x) Tizedesvessz utni rtkek: toFixed(2) 314.16
toString() Szmtpus konvertlsa stringbe
A String objektum metdusai
var s = new String(value); plda: var s = new String('Almspite');
nv Mvelet
length A string karaktereinek szmt adja vissza: s.length 9
charAt(i) A stringben "i"-edik pozcijn lv karaktert adja vissza. (Nulladik elemmel kezddik!): s.charAt(2) "m"
charCodeAt(i) Az "i"-edik pozcin lv karaktert kdjt adja vissza: s.charCodeAt(0) 65
concat(s) S Stringhez fz stringet: s.concat('kusz') "Almspitekusz"
fromCharCode(i) ASCII kd karakter rtkt (rtkeit) adja vissza : String.fromCharCode(72,69,76,76,79) "HELLO"
indexOf(s) A paramterknt megadott karakterlnc els elfordulsa a stringben: s.indexOf("pite") 5
lastIndexOf(s) A paramterknt megadott karakterlnc utols elfordulsa a stringben
substr(i,j) Karakterlnc kivgsa, "i" pozcitl; "j" hosszan: s.substr(5,4) "pite"
toLowerCase() A stringet kisbetsre konvertlja.
toUpperCase() A stringet nagybetsre konvertlja.
valueOf() A string rtkt adja vissza (kt string sszehasonltsnl fontos!)
JavaScript tananyag
54
Az Array objektum metdusai
var tomb = new Array('Uborka','Dinnye','Krumpli','Sajt');
nv mvelet
length A tmb elemszmval tr vissza: tomb.length 4
concat() Kt, vagy tbb tmbt egyest
indexOf() A paramterknt kapott rtket keresi a tmbben, s indexet ad vissza: tomb.indexOf('Dinnye') 1
lastIndexOf() Ugyanaz mint az "indexof", de az utols elfordulst adja vissza.
pop() Eltvoltja a tmb utols elemt: tomb.pop() 'Uborka','Dinnye','Krumpli'
push() j elemet fz a tmb vgre: tomb.push('Sajt')
shift() Eltvoltja a tmb els elemt: tomb.shift() 'Dinnye','Krumpli','Sajt'
unshift() j elemet szr be a tmb els pozicijra. tomb.unshift()
Forrsok
http://hu.wikipedia.org/wiki/JavaScript : Bevezet
http://www.w3schools.com/jsref/default.asp : JavaScript referencia
http://www.w3schools.com/js/default.asp : JavaScript tutorial
http://hu.wikipedia.org/wiki/JavaScripthttp://www.w3schools.com/jsref/default.asphttp://www.w3schools.com/js/default.asp
JavaScript tananyag
55