5. lecke
Elágazás, ha a JavaScript utasításai

Elágazó operátorok célja, hogy a program futtassa ezt vagy azt a kódblokkot, attól függően, hogy a feltétel igaz vagy hamis.

Ötféle elágazó operátor létezik, ebben a leckében kettőt fogunk megvizsgálni:
- fiókkezelő, ha
- ha más, a fióktelep üzemeltetője

Futtatja a kódot, ha a feltétel igaz.

Az összehasonlító vagy logikai műveleteket általában feltételként használják az elágazó operátorokban.

A fiókkezelő sémája, ha így néz ki:

Ha (feltétel) (a kód akkor fut, ha a feltétel igaz)

Mondjunk egy példát az if elágazó operátorral:

// két változó létrehozása var numOne; var numTwo; // rendelje hozzá a változókat az értékekhez numOne = 5; számTwo = 3; if (numOne> numTwo) (figyelmeztetés ("A feltétel visszaadva igaz");)

A szkriptben létrehoztunk két változót: numOne és numTwo, és hozzárendeltük hozzájuk az 5 -ös és 3 -as számértékeket.

Ezután létrehoztunk egy if elágazó operátort, amely két változó értékét hasonlítja össze. Ha az összehasonlítási művelet igaz értéket ad vissza, akkor a göndör zárójelek közötti kód fut. Esetünkben megjelenik egy ablak, amelyben az Állapot igaz visszaadása üzenet jelenik meg. Ha az összehasonlítási művelet hamis értéket ad vissza, akkor semmi sem történik.

A kettős perjel, //, megjegyzések. A kettős perjel után bármilyen szöveget írhat, a JavaScript -értelmező megjegyzésként fogja fel, és nem dolgozza fel. Mint emlékezünk, nyelveken és, megjegyzéseket is létrehozhat.

Elágazó kezelő, ha más, egy adott kódblokk futtatására szolgál, attól függően, hogy a feltétel milyen értéket ad vissza: igaz vagy hamis

Az ágkezelő sémája, ha másképp néz ki, így néz ki:

Ha a (feltétel) (a kód akkor fut, ha a feltétel igaz)

Mondjunk egy példát a fiókkezelővel, ha más:

Var numOne; var numTwo; numOne = 5; számTwo = 3; if (numOne> numTwo) (alert ("A feltétel igaznak tért vissza");) else (alert ("A feltétel hamisan tért vissza");)

Rendelje hozzá a numTwo változót, amely nagyobb, mint 5, például 7, akkor a feltétel hamis értéket ad vissza, és megjelenik egy ablak, amelyben a Feltétel hamis üzenet jelenik meg.

Térjünk vissza nyulainkhoz

Emlékezzünk vissza az utolsó fejezetből a nyulakkal és Mazai -val kapcsolatos feladatra.
Az elvégzett (vagy nem végrehajtott) feltételek és műveletek használata nélkül
a feltételektől függően számolja meg az utolsó nyulak számát
a hajó nem lesz könnyű.

Adjunk hozzá egy ágat a lastBoatRabbits függvényhez:

var lastBoatRabbits = függvény (totalRabbits)(if (totalRabbits === 0) (// return 0;) else (var restRabbits = totalRabbits% 6; if (restRabbits === 0) (// return 6;) else (return restRabbits;)));

Tehát, ha nincsenek mezei nyulak a folyón, az utolsó hajó senkit sem hoz (sőt, szinte azonnal vissza fog térni, mert nagyapa biztosan tudja, hogy nincs nyúl a folyón).

És ha a folyón a mezei nyulak száma 6 -szorosa, akkor az utolsó csónak teljesen tele lesz nyúllal.

Mit lehetne még javítani ezen a programon? Külön változót használnék,
tárolja a csónakban elférő mezei nyulak számát, hátha a hálás
a mezei nyúl nagyobb csónakot ad Mazaynak. Sosem tudhatod, mi hirtelen.

függvény (totalRabbits)(if (totalRabbits === 0) (return 0;) else (var restRabbits = totalRabbits% boatCapacity; if (restRabbits === 0) (return boatCapacity;) else (return restRabbits;)));

Elágazó szintaxis

Az elágazásnak lehet része, amelyet akkor hajtanak végre, ha a feltétel nem igaz,
vagy lehet, hogy nincs:

// Opció két ággal: if (eső esik) (stayHome (); // Ha az rainIsFalling == igaz, akkor ez a rész végrehajtásra kerül) else (walkInAPark (); // Ellenkező esetben ez a rész végrehajtódik } // Opció egy ággal: ha (musicIsPlaying) (tánc ();) // Ha a musicIsPlaying == hamis, a program végrehajtása csak folytatódik

Körülmények

Az if feltétel lehet kifejezés két szám vagy karakterlánc összehasonlítására,
műveletek használatával ==,>,< , >= , <= , != и === , любая переменная, которой
logikai értéket és minden olyan értéket kapott, amely a munka eredményeként jött létre
ha boolean -re fogják önteni.

Példák összehasonlításra:

10> 5 // => igaz 11< 6 // =>hamis 5> = 5 // => igaz 3! = 3 // => hamis "abc" == "abc" // => igaz "abc" === "abc" // => igaz

Változók, mint feltétel:

var feltétel = 10> 5; if (feltétel) (konzol .log ("10> 5"); // Kivégezik }

Logikai műveletek feltételek mellett

Több kifejezés logikai (vagy logikai) értékeket ad vissza
logikai műveletekkel kombinálható. Ezeket a műveleteket nevezik:
logikai ÉS &&&, logikus VAGY || és logikus tagadás! ...

igaz igaz; // => igaz hamis || hamis; // => hamis! hamis; // => igaz

A logikai ÉS csak akkor ad vissza igazot, ha mindkét oldalán igaz,
a logikai VAGY hamisat ad vissza, ha mindkét oldala hamis.
A tagadás hamisat ad vissza igaznak, és fordítva, igaznak hamisat.

A Javascript szabályok szerint a 0, null és undefined értékek hamis értékre kerülnek.
Az eredmény && megszerzésekor azonban megkapjuk az első csökkentett értéket, amely
hamisra csökken, és az eredmény megkapása || - az első csökkentett érték,
ami igazra változik:

0 && true; // => 0 6 || 7 || hamis; // => 6! 0; // => igaz

Így az utolsó csónakban lévő mezei nyulak számát visszaadó függvény így írható át:

var boatCapacity = 6; var lastBoatRabbits = függvény (totalRabbits)(return totalRabbits && (totalRabbits% boatCapacity || boatCapacity););

Feladatok

1. Írjon egy fizzbuzz függvényt, amely számparamétert vesz fel, és:
   • Háromszoros esetén a "Fizz" értéket adja vissza
   • Öt többszörös esetén a "Zümm" értéket adja vissza
   • Tizenötszörös (három és öt egyszerre) esetén a "FizzBuzz"
   • Ellenkező esetben az eredeti számot adja vissza
2. Írjon egy iGoToNorth függvényt, amely számparamétert vesz fel, és meghatározza, hogy az átadott szám megfelelő -e számunkra. A szám akkor megfelelő, ha több mint 10, kevesebb, mint 30 és 7 -szerese.

Jó napot mindenkinek. Alexey Gulynin felveszi a kapcsolatot. Az utolsó cikkben szétszedtük hurkok létrehozása javascriptben... Ebben a cikkben a következőkről szeretnék beszélni feltételes utasítás a JavaScriptben... Általában minden programozás feltételekből áll, és minden programozási nyelvben (a JavaScript sem kivétel) létezik egy feltételes operátor fogalma. A feltételes operátor jelentése hogy ha a feltétel teljesül, akkor hajtsa végre ezeket a műveleteket, ha nem, akkor tegyen más műveleteket. A feltételes operátor általános sémája a következő:

If (feltétel) (// Statement block); else (// Statement block)

Írjunk rögtön egy példát: a felhasználótól kérünk egy számot, és ha páros, akkor üzenetet jelenítünk meg "Ez a szám páros", ha nem - "ez a szám páratlan":

Ha beírja ezt a kódot, látni fogja, hogy minden működik. Most megmutatom, mennyire fontos JavaScript szintaxis... Távolítsa el a ";" mielőtt a másik és a kód azonnal leáll. Ezért mindig legyen óvatos. Az alábbi cikkek egyikében elmondom hogyan lehet elkapni a hibákat a JavaScriptben.
Az egyik feltételes állítás beilleszthető a másikba. Tegyünk hozzá egy ellenőrzést, hogy a felhasználó beírta -e a "0" számot.

Most megmutatom, hogyan ellenőrizhet több feltételt. Van olyan, hogy logikus "ÉS" (a & & szimbólumokkal jelölve). Van egy koncepció is logikus "VAGY"(|| szimbólumokkal jelölve). A logikus "ÉS" magasabb prioritással bír, azaz először ezt a feltételt ellenőrzik, majd a logikai "VAGY" -t.
Nézzük meg ezt a példát: hozzunk létre egy véletlenszerű számot 1 -től 10 -ig. Meg kell jeleníteni a "A kívánt szám =" kifejezést és magát a számot, ha ez a szám nem egyenlő 6 -tal és több mint 5 vagy több, mint 1, de kevesebb, mint 4:

Ebben az esetben a kívánt számok a következők: 2,3,7,8,9,10. A többi szám nem felel meg a feltételnek.
Szeretném felhívni a figyelmet a "! =" Operátorra is, ami azt jelenti, hogy "nem egyenlő". Végül a feltételek összeállításakor mindig ügyeljen a zárójelek elhelyezésére. A legtöbb hiba a helytelen elhelyezésből adódik.

Ha a programozás mindig lineáris lenne, akkor valószínűleg nem is létezne. Valójában szinte minden programban vannak különböző következmények, amelyek bizonyos külső vagy belső tényezőktől függenek. Ezeket az ágakat a segítségével hozzák létre feltételes operátorok, amelyről ebben a cikkben mesélek.

Általános forma feltételes operátor a JavaScriptben ilyen:

Ha (feltétel) (
// Nyilatkozat blokk
}
más (
// Nyilatkozat blokk
}

A kulcsszó az első ha amely közli a böngészővel, hogy a feltételes utasítás következik. A zárójelek között feltétel van feltüntetve, amely ennek megfelelően visszatér igaz vagy hamis... Ha a zárójelben lévő kifejezés az volt igaz (valóban), akkor az utasítás első blokkja végrehajtásra kerül, ha a feltétel hamis (hamisan), majd a kijelentések blokkját más... Blokkolni is más opcionális, és alább egy példát hozok.

Gyakoroljunk most a gyakorlatban. Oldjuk meg a következő problémát: a felhasználó beír egy számot, és megjelenítünk egy üzenetet - akár több, akár kevesebb 5 .

ha (x< 5) alert ("Введённое число меньше пяти");

Nézzük ezt a példát. Az első sorban hívjuk a függvényt gyors amely megnyit egy ablakot, amely a szám megadását kéri. Ezután a felhasználó beír egy számot, amelyet egy változóba írnak x... És akkor jön a feltétel, amit így fordítok: Ha x kisebb, mint 5, akkor jelenítse meg az üzenetet: "A bevitt szám kevesebb, mint öt", ellenkező esetben jelenítse meg a "A bevitt szám nagyobb, mint öt" üzenetet.... Kifejezés x< 5 visszatér sem igaz ( < 5 ) vagy hamis (x> = 5). Vegye figyelembe azt is, hogy nem használunk göndör fogszabályzót. Miért? Mivel csak egy operátort használunk (függvény éber ()). Elvileg feltehetjük őket, és semmi sem fog változni, azonban itt fölöslegesek lesznek.

Feladatunk azonban jelentős hibát tartalmaz. Ha a felhasználó belép " 5 ", majd az üzenet" A megadott szám nagyobb, mint öt"ez azonban nem teljesen helyes. Tehát alakítsuk át a feltételt így:

Ha (x< 5) alert ("Введённое число меньше пяти");
más
if (x == 5) alert ("Öt beírt");
else alert ("A bevitt szám nagyobb, mint öt");

Mint látható, a blokk más az első feltételben átalakult. A blokkban más x és 5 egyenlőségét ellenőrzik. És ha igen, akkor a megfelelő üzenet jelenik meg, ellenkező esetben megjelenik, hogy a szám nagyobb, mint öt. Azaz egy állapoton belüli állapot teljesen normális. Azt is vegye figyelembe, hogy még mindig nem tettem göndör fogszabályzót ha más ez az egyik operátor. És ha csak egy operátor van, a zárójelek nem kötelezőek.

Vegyünk egy másik példát. Hozzunk létre egy változót, ami lesz igaz ha a bevitt szám pozitív, és hamis ha a szám negatív.

Var x = prompt ("Adjon meg egy számot");
var pozitív = igaz;
ha (x< 0) positive = false;
éber (pozitív);

Ez a példa egy klasszikus példát használ, amikor veszünk egy változót, és hozzárendelünk egy alapértelmezett értéket. És ha szükséges, akkor változtatunk. Ebben az esetben megváltoztatjuk az alapértelmezettet, ha a szám negatív. Ezt a példát azonban még szebben is meg lehetett volna írni:

Var x = prompt ("Adjon meg egy számot");
var pozitív = x< 0;

Más szóval, változóak vagyunk pozitív azonnal rendelje hozzá az összehasonlítás eredményét xés vakarja.

Most beszéljünk az ún nehéz körülmények... A fenti példákban csak egyszerű feltételeket vettünk figyelembe, azonban vannak más feltételek is, amelyek több feltételből állnak. És itt két műveletet használnak: && - logikus ÉSés || - logikus VAGY... Írjunk egy ilyen feltételt:

Ha ((x<= 5) && (x >= 0)) (// operátor blokk)

Ez az állapot (összetett feltétel) megadja igaz, ha, és csak akkor ha x<= 5 И x >= 0 ... Ellenkező esetben visszatér hamis.

Tekintsünk egy komplex állapotot a logikus VAGY.

Ha ((x<= 5) || (x == 6)) {//блок операторов}

Lefordíthatod így: ha x<= 5 ИЛИ x == 6 majd vissza igaz, másképp hamis.

Az utolsó dolog, amit szeretnék mondani, hogy vannak olyan feltételek, amelyek abból állnak többszörös logikai ÉS és VAGY, és néha nagyon komolyan meg kell feszítenie a fejét, hogy megértse az ilyen állapotot.

Ennyit akartam mondani feltételes állítások a JavaScriptben... És akkor csak gyakorolni kell. Sajnos gyakorlás nélkül soha nem fogod megtanulni használni ezt az operátort, anélkül egyszerűen értelmetlen továbblépni. Tehát álljon elő néhány egyszerű problémával (például a fentiekkel), és oldja meg.

JavaScript - 7. lecke. Programágak - If Statement

Nagyon gyakran olyan helyzet áll elő, amikor egy feltételtől függően valamilyen műveletet kell végrehajtanunk. Például van egy online ruházati boltunk. Megkérdezzük a felhasználót, hogy kicsoda (férfi vagy nő), és a választól függően megjelenítjük a megfelelő termékek listáját (férfi vagy nő). Ilyen programok írása során használják feltételes if... Szintaxisa a következő:

Ha B (S1)
más (S2)

Ahol B logikai típusú kifejezés, és S1és S2- üzemeltetők.

Ez így működik: a kifejezés értéke kiszámításra kerül B, ha igaz, akkor az operátor végrehajtásra kerül S1, ha ez hamis, akkor az operátor végrehajtásra kerül S2... Húr más (S2) elhagyható.

Azt hiszem, egy példa világosabbá teszi. Tegyük fel, hogy van egy űrlapunk, ahol a felhasználó 3 értéket ad meg. Írjunk egy szkriptet, amely meghatározza a megadott számok maximumát.

Először írjuk be az űrlap kódját a html oldalra:

Javascript, ha

Most írja be a függvénykódot a script.js oldalon:

függvény maxZnach (obj) (var a = 1 * obj.zn1.value; var b = 1 * obj.zn2.value; var c = 1 * obj.zn3.value; var m = a; if (b> m) m = b; ha (c> m) m = c; obj.res.value = m;)

Tehát a függvényünk három értéket vesz ki az űrlapból, a maximumért ( m) vesszük az értéket a... Akkor összehasonlítjuk: ha az érték b nagyobb, mint a maximum (pl. a), akkor a maximum lesz b, különben marad a maximum a(mivel a zárójelben lévő kifejezés nem igaz). Ezután hasonlóképpen hasonlítsa össze a következő értéket c a maximummal. A választ az eredmény mezőben adjuk ki ( res).

Általában egy ilyen forgatókönyvet meg lehetne írni a módszerrel max tárgy Math az utolsó leckében tárgyalt, és a kód rövidebb lenne:

függvény maxZnach (obj) (var a = 1 * obj.zn1.value; var b = 1 * obj.zn2.value; var c = 1 * obj.zn3.value; obj.res.value = Math.max (Math .max (a, b), c);)

Ez azt jelenti, hogy a programozás még mindig kreatív folyamat, és egy probléma különböző módon megoldható. A programozó feladata, hogy megtalálja a legoptimálisabb lehetőséget. De ez így van, lírai kitérő. Térjünk vissza az if állításhoz, és nézzünk egy érdekesebb példát. Írjunk egy szkriptet, amelynek működése során, ha az egérmutatót a kép fölé viszi, akkor nőni fog, nagyító hatást keltve.

Ahogy HTML -ben emlékszik, beállíthatja a beillesztett kép méretét. Ha a megadott méretek nagyobbak vagy kisebbek, mint az eredeti, akkor a böngésző automatikusan illeszti az eredetit ezekhez a méretekhez. Ezt fogjuk használni. Készítsünk egy ilyen képet:

Az eredeti 302 pixel széles. Azt akarjuk, hogy az oldalon lévő kép 102 képpont széles legyen, és lebegéskor 302 képpontra nőjön. A html oldalon minden világos:

Javascript, ha

Funkciónkban pedig a feltételes operátor mellett a standard javascript függvényt is használni fogjuk setTimeout amely egy megadott időtartamra hívja meg a felhasználó által definiált függvényt:

Funkció bigPict () (var w = document.tigr.width; if (w Így a függvény ellenőrzi a kép szélességét ( szélesség), és ha kevesebb, mint 302 képpont, akkor ezt a szélességet 10 képponttal növeli. Funkció setTimeout függvényünket hívja bigPict fél másodpercenként, ami miatt a kép mérete addig nő, amíg az állapot w nem lesz hamis.

A vizuális simítás érdekében próbálja csökkenteni a lépést és a függvényhívási időt. Játsszon ezekkel a számokkal, és keresse meg a legjobbakat.

Mára ennyi, házi feladatként adja hozzá a szkriptünket, hogy a kép, amikor az egérmutató kilép, visszatérjen eredeti értékeihez (azaz 102 képpont). Ha nem működik, töltse le