Egy adott feltétel beteljesülésének vizsgálata. Általános szintaxis:
if(feltetel){
ha teljesul a feltetel
} else {
ha nem teljesul a feltetel
}
| && | és operátor |
| || | vagy operátor |
| ! | nem operátor |
var x = 5;
if(x < 10){
alert("x kisebb, mint 10");
} else {
alert("x nagyobb vagy egyenlo, mint 10");
}
// Mekorra z erteke?
var x = 5;
var y = 10;
var z;
if (x > 10 && y > 10) {
z = 20;
} else {
z = 10;
}
// Mi irodik ki?
var b1 = 10;
var b2 = 20;
if ( b1 != 10 || b2 != 20)
alert("if1");
if ( b1 != 10 && b2 != 20)
alert("if2");
var b4 = false;
var b5 = false;
if(b4 && b5)
alert("if3");
if(!b4 && !b5)
alert("if4");
<html>
<head>
<meta charset="utf-8" />
<title>Feltétel vizsgálat</title>
</head>
<body>
<h3>
<script type="text/javascript">
var age=prompt("Hány éves vagy?");
if( age >= 65 ){
document.write("Már nyugdíjas lehetsz! ");
}
else{
document.write("Még fiatal vagy! ");
}
</script>
</h3>
</body>
</html>
Tömörített szintaxis: feltétel ? teljesül_a_feltéte : nem_teljesül_a_feltétel
Az előző példa tömörített if utasítással:
<html>
<head>
<meta charset="utf-8" />
<title>Feltétel vizsgálat</title>
</head>
<body>
<h3>
<script type="text/javascript">
var age=prompt("Hány éves vagy?");
var text = (age > 65 ) ? "Már nyugdíjas lehetsz! " : "Még fiatal vagy! ";
document.write(text);
</script>
</h3>
</body>
</html>
Lépcsőzetes eldöntések esetén használatos. Általános felépítése:
if(feltetel1){
ha teljesul a feltetel1
} else if(feltetel2){
ha teljesul a feltetel2
} else if(feltetel3){
ha teljesul a feltetel3
} else {
ha egyik felteltel sem teljesul
}
Életkor példa egy extra feltétellel:
<html>
<head>
<meta charset="utf-8" />
<title>Feltétel vizsgálat</title>
</head>
<body>
<script type="text/javascript">
var age=prompt("Hány éves vagy?");
if( age > 0 && age <= 18 ){
document.write("Még iskolás lehetsz. ");
} else if( age > 18 && age < 60 ){
document.write("Sanszos, hogy dolgozol!");
} else {
document.write("Már nyugdíjas lehetsz ");
}
</script>
</body>
</html>
A két kód azonos, de a B kód kerülendő
<script type="text/javascript">
// A kód
var x = 5;
if(x > 4) {
document.write("x nagyobb, mint 4");
} else {
document.write("x nem nagyobb, mint 4");
}
</script>
<script type="text/javascript">
// B kód, kerülendő, két döntési müvelet
var x = 5;
if(x > 4) {
document.write("x nagyobb, mint 4");
}
if(x <= 4){
document.write("x nem nagyobb, mint 4");
}
</script>
A két kód NEM azonos,a B kód hibás
<script type="text/javascript">
// A kód
var x = 3;
if(x <= 4) {
document.write("x nem nagyobb, mint 4");
} else if(x <= 10 ){
document.write("x nem nagyobb, mint 10");
} else {
document.write("x nagyobb, mint 10");
}
</script>
<script type="text/javascript">
// B kód, hibás értelmezés
var x = 3;
if(x <= 4) {
document.write("x nem nagyobb, mint 4");
}
if(x <= 10 ){
document.write("x nem nagyobb, mint 10");
} else {
document.write("x nagyobb, mint 10");
}
</script>
Szintés képcsőzetes feltétel vizsgálatra alkalmas. Általános felépítés:
<script type="text/javascript">
switch (kifejezés vagy érték){
case érték1 :
csinálunk valamit1;
break;
case érték2 :
csinálunk valamit2;;
break;
...
default : alap kifejezés;
}
</script>
A hét napjainak kiiratása:
<html>
<head>
<meta charset="utf-8" />
<title>A hét napjai</title>
</head>
<body>
<script type="text/javascript">
var day_of_week=Math.floor((Math.random()* 7)+1);
// Egy véletlen szám 1 és 7 között
// Math.floor: az egész részét adja egy racionális számnak
// pl Math.floor(1.8) eredménye: 1
// pl Math.floor(3.4) eredménye: 3
switch(day_of_week){
case 1: document.write("Hétfő van"); break;
case 2: document.write("Kedd van"); break;
case 3: document.write("Szerda van"); break;
case 4: document.write("Csütörtök van"); break;
case 5: document.write("Péntek van"); break;
case 6: document.write("Szombat van"); break;
default: document.write("Vasárnap van"); break;
}
</script>
</body>
</html>
Miért kell a break? Ha nincs break és egy feltétel igaz lesz, az utaná következő esetek (case) is mind teljesülnek és végrehajtodnak.
<html>
<head>
<meta charset="utf-8" />
<title>Miért kell a break?</title>
</head>
<body>
<script type="text/javascript">
var x = 2;
switch(x){
case 1: document.write("Egy ");
case 2: document.write("kettő ");
case 3: document.write("Három ");
case 4: document.write("Négy ");
default: document.write("Default ");
}
</script>
</body>
</html>
Természetesen nem csak számokkal, hanem szövegekkel is müködik a switch
<html>
<head>
<meta charset="utf-8" />
<title>Szöveg switch</title>
</head>
<body>
<script type="text/javascript">
// figyeljünk a kisbetű / nagybetű eltérésre
var nev = "Károly";
switch(nev){
case "Béla": document.write("5. szoba "); break;
case "Zoltán": document.write("6. szoba "); break;
case "Károly": document.write("7. szoba "); break;
case "Imre": document.write("8. szoba "); break;
default: document.write("nincs név találat "); break;
}
</script>
</body>
</html>
1. Feladat Írd át az alabbi tömörített feltételt if/else alakba:
var munkaidő = (nap == hetvege) ? 6 : 8;
Általános szabály: kapcsos zárójelen belül deklarált válotozó (ún. lokális változó) csak a kapcsos zárójelen belül érhető el, illetve használható. Sajnos a modern script nyelvek már engedékenyebbek, így a lokális változók a deklarálásuk után máshol is használhatóak, de nem mindig. Erre példa
<html>
<head>
<meta charset="utf-8" />
<title>Globális / Lokális változók</title>
</head>
<body>
<script type="text/javascript">
// globalis valtozo, nincs kapcsos zarojelhez kotve
var globalisValtozo = 19;
document.write("globalisValtozo értéke az if előtt: "+globalisValtozo+"<br>");
if(globalisValtozo > 10)
{
var lokalisValtozo = 11;
document.write("lokalisValtozo értéke az if-ben: "+lokalisValtozo+"<br>");
// adjuk mas erteket a globalisValtozo-nak
globalisValtozo = 22;
}
document.write("globalisValtozo értéke az if után: "+globalisValtozo+"<br>");
// nem szerencsés használat. Kerulendo!!!
document.write("lokalisValtozo értéke az if után: "+lokalisValtozo+"<br>");
lokalisValtozo += 10;
document.write("lokalisValtozo értéke: "+lokalisValtozo+"<br>");
</script>
</body>
</html>
Erre még visszatérünk a függvények tanulásakor!