Példa: számológép
<html>
<head>
<title>Számológép</title>
<script language="JavaScript">
function elVegez() {
var bemenet = document.szamol.input.value;
document.szamol.input.value = eval(bemenet);
}
function osszeAd() {
document.szamol.input.value += '+';
}
function kivon() {
document.szamol.input.value += '-';
}
…
</script>
</head>
<body>
<p>
<form name="szamol">
<table width="55" height="65" cellspacing="2" cellpadding="5" border="1">
<tr>
<td>
<input type="text" name="input" SIZE="20" maxlength="30">
<td>
<input type="button" value=" ^ " onClick="hatvany()">
<td>
<input type="button" value=" C " onClick="document.szamol.input.value = ''; ">
<td>
<input type="button" value="Cos" onClick="cos()">
</tr>
<tr>
<td>
<input type="button" value=" 1 " onClick="szam(1)">
…
</table>
</form>
</p>
</body>
</html>
A számológép példa jelentése: számológép használata webes felületen.
Elemzés: számológép
A számológép alapvető nehézsége abban rejlik, hogy a JavaScriptben nem levő matematikai műveleteket magunknak kell megvalósítani. Alapvetően a Math objektum tulajdonságait használja fel, ill. a már jól ismert aritmetikai műveleteket kombinálja a bonyolultabb függvények megvalósításához.
Számológép használata
A számológép példa használata semmiben sem különbözik a normál számológép használattól. Van kijelzője, vannak gombjai, melyek segítségével eléri nemcsak a négy alapműveletet, hanem tudományos számításokra is képes, például szinusz függvény értéket is számol.
Példa: kirakójáték
<html>
<head>
<title>Kirakó</title>
<script language="JavaScript">
var uresPoz = 16, szamol = 0, pozicio = new Array(), stilus = new Array();
pozicio[1] = 7;
…
function kezd() {
stilus[1] = negyzet1.style;
…
document.onkeydown = billLeut;
}
function billLeut() {
var ieKey = event.keyCode;
if (ieKey == 38) {
if (uresPoz < 13) {
szamol=uresPoz + 4;
X = kedv(szamol);
Z = (parseInt(stilus[X].top));
stilus[X].top = Z - 52;
Q = pozicio[X];
pozicio[X] = uresPoz;
uresPoz = Q;
}
}
else if (ieKey == 40) {
if (uresPoz > 4) {
szamol = uresPoz - 4;
X = kedv(szamol);
Z = (parseInt(stilus[X].top));
stilus[X].top = Z + 52;
Q = pozicio[X];
pozicio[X] = uresPoz;
uresPoz = Q;
}
}
…
A = false;
b = 0;
for (i = 1; i < 16; i++) {
b++;
if (pozicio[i] == b) {
A = true;
}
else {
A = false;
break;
}
}
if (A) alert("GRATULÁLOK!");
}
function kedv(szamol) {
for (var i = 1; i < 16; i++) {
if (pozicio[i] == szamol) {
var X = i;
}
}
return X;
}
</script>
</head>
<body onLoad="kezd()">
<div ID="negyzet8" style="position:absolute; left:202px; top:102px; width:50px; height:50px; background-color:green;">
<br><b><center>8</center>
</div>
…
</p>
</body>
</html>
Elemzés: kirakójáték
A példa alapvetően a billentyűlenyomásokat figyeli, azaz eseménykezelőt használ a játék létrehozására. Ez az eseménykezelő az onKeyDown. A kód felhasználja a lenyomás során keletkezett esemény tulajdonságait is. A helyes pozíció megtalálásához felhasználja a parseInt függvényt és az Array objektumot.
A kirakójáték jelentése: webes felületen is könnyen lehet játékot készíteni. A példa 15 szám kirakását valósítja meg.
Kirakójáték használata
A kirakójáték használata egyszerű. A billentyűzet nyíl gombjainak segítségével növekvő sorba kell rakni 15 számot úgy, hogy csak bizonyos mozgásokat enged meg a program (1 üres hely van).