Lecția numărul 5
Ramificări dacă declarații în JavaScript

Operatori de ramificare sunt concepute astfel încât programul să poată rula acest bloc bloc sau altul, în funcție de condiția adevărată sau falsă.

Există cinci tipuri de operatori de ramificare, în această lecție vom analiza doi dintre ei:
- operator sucursală dacă
- operator sucursală dacă altfel

Rulează codul dacă condiția revine adevărată.

Comparația sau operațiile logice sunt de obicei utilizate ca condiții în operatorii de ramificare.

Schema operatorului de sucursală dacă arată astfel:

Dacă (condiție) (codul va rula dacă condiția revine adevărată)

Să dăm un exemplu cu operatorul de ramificare if:

// creați două variabile var numOne; var numTwo; // atribuiți variabilele valorilor numOne = 5; numTwo = 3; if (numOne> numTwo) (alert („Condiția a fost returnată adevărată”);)

În script, am creat două variabile numOne și numTwo, le-am atribuit valorile numerice 5 și 3.

Apoi, am creat un operator de ramificare if, care compară valorile a două variabile. Dacă operațiunea de comparație revine adevărată, atunci codul dintre acoladele va rula. În cazul nostru, va apărea o fereastră cu mesajul Condition returnat true. Dacă operațiunea de comparație revine falsă, atunci nu se întâmplă nimic.

Caracterele dublei oblice, //, sunt comentarii. După dubla bară, puteți scrie orice text, interpretul JavaScript îl va percepe ca un comentariu și nu îl va procesa. După cum ne amintim, în limbi și, puteți crea și comentarii.

Operator de ramificare, dacă altfel, este destinat să ruleze un anumit bloc de cod, în funcție de valoarea pe care condiția o va returna: adevărat sau fals

Schema operatorului de sucursală, dacă altceva arată astfel:

Dacă (condiție) (codul va rula dacă condiția revine adevărată) altceva (codul va rula dacă condiția returnează fals)

Să dăm un exemplu cu operatorul de sucursală dacă altfel:

Var numOne; var numTwo; numOne = 5; numTwo = 3; if (numOne> numTwo) (alert ("Condiția a revenit adevărată");) else (alert ("Condiția a fost returnată falsă");)

Alocați variabila numTwo, un număr mai mare de 5, de exemplu 7, atunci condiția va reveni falsă și va apărea o fereastră cu mesajul Condiție returnată falsă.

Să ne întoarcem la iepurii noștri

Să ne reamintim sarcina despre iepuri și Mazai din ultimul capitol.
Fără utilizarea condițiilor și acțiunilor efectuate (sau neefectuate)
în funcție de condiții, numărați numărul de iepuri din ultimul
barca nu va fi ușoară.

Să adăugăm o ramură la funcția lastBoatRabbits:

var lastBoatRabbits = funcție (totalRabits)(if (totalRabbits === 0) (// return 0;) else (var restRabbits = totalRabbits% 6; if (restRabbits === 0) (// return 6;) else (return restRabbits;)));

Deci, dacă nu există iepuri pe râu, ultima barcă nu va aduce pe nimeni (de fapt, se va întoarce aproape imediat, deoarece bunicul va ști sigur că nu există iepuri pe râu).

Și dacă numărul de iepuri pe râu este multiplu de 6, atunci ultima barcă va fi complet încărcată cu iepuri.

Ce altceva ar putea fi îmbunătățit în acest program? Aș folosi o variabilă separată,
stocarea numărului de iepuri care se potrivesc în barcă, în cazul în care cei recunoscători
iepurii îi vor da lui Mazay o barcă mai mare. Nu știi niciodată ce brusc.

funcție (totalRabits)(if (totalRabbits === 0) (return 0;) else (var restRabbits = totalRabbits% boatCapacity; if (restRabbits === 0) (return boatCapacity;) else (return restRabbits;)));

Sintaxa ramificării

Ramificarea poate avea o parte care este executată dacă condiția nu este adevărată,
sau poate nu o are:

// Opțiune cu două ramuri: if (rainIsFalling) (stayHome (); // Dacă rainIsFalling == true, această parte este executată) else (walkInAPark (); // În caz contrar, această parte este executată } // Opțiune cu o ramură: if (musicIsPlaying) (dance ();) // Dacă musicIsPlaying == false, executarea programului continuă

Condiții

Condiția din dacă poate fi o expresie pentru compararea a două numere sau șiruri,
folosind operații ==,>,< , >= , <= , != и === , любая переменная, которой
i s-a atribuit o valoare booleană și doar orice valoare ca rezultat al lucrării
dacă va fi aruncat la boolean.

Exemple de comparație:

10> 5 // => adevărat 11< 6 // =>false 5> = 5 // => adevărat 3! = 3 // => fals "abc" == "abc" // => adevărat "abc" === "abc" // => adevărat

Variabile ca condiție:

var condiție = 10> 5; if (condiție) (console .log ("10> 5"); // Va fi executat }

Operațiuni logice în condiții

Expresii multiple care returnează valori booleane (sau booleene)
poate fi combinat folosind operații booleene. Aceste operații se numesc:
logic AND &&, logic OR || și negație logică! ...

adevarat adevarat; // => adevărat fals || fals; // => false! false; // => adevărat

Boolean ȘI returnează adevărat numai dacă este adevărat pe ambele părți ale acestuia,
OR OR returnează fals numai dacă ambele părți ale acestuia sunt false.
Negarea returnează fals pentru adevărat și, dimpotrivă, adevărat pentru fals.

Conform regulilor Javascript, valorile 0, nul și nedefinit sunt transformate în false.
Cu toate acestea, atunci când obținem rezultatul && obținem prima valoare neredusă, care
este redus la fals și obține rezultatul || - prima valoare neredusă,
care se transformă în adevărat:

0 && true; // => 0 6 || 7 || fals; // => 6! 0; // => adevărat

Astfel, funcția care returnează numărul de iepuri din ultima barcă ar putea fi rescrisă astfel:

var boatCapacity = 6; var lastBoatRabbits = funcție (totalRabits)(returnează totalRabbits && (totalRabbits% boatCapacity || boatCapacity););

Sarcini

1. Scrieți o funcție fizzbuzz care ia un parametru numeric și:
   • Pentru multipli de trei, returnează „Fizz”
   • Pentru multipli de cinci, returnează „Buzz”
   • Pentru multipli de cincisprezece (trei și cinci în același timp), returnează „FizzBuzz”
   • În caz contrar, returnează numărul original
2. Scrieți o funcție iGoToNorth care ia un parametru număr și determină dacă numărul trecut este potrivit pentru noi. Numărul este potrivit dacă este mai mare de 10, mai puțin de 30 și multiplu de 7.

Ziua bună tuturor. Alexey Gulynin este în contact. În ultimul articol, am dezasamblat crearea de bucle în javascript... În acest articol, aș vrea să vorbesc despre declarație condiționată în JavaScript... În general, toată programarea constă în condiții și în toate limbajele de programare (JavaScript nu face excepție) există un concept de operator condiționat. Semnificația operatorului condițional este că dacă condiția este îndeplinită, atunci faceți aceste acțiuni, dacă nu, atunci faceți alte acțiuni. Schema generală a unui operator condiționat este după cum urmează:

If (condiție) (// Bloc de declarații); else (// Bloc de declarații)

Să scriem un exemplu imediat: vom cere utilizatorului un număr și, dacă este egal, vom afișa un mesaj „Acest număr este par”, dacă nu - "acest număr este impar":

Dacă introduceți acest cod, veți vedea că totul funcționează. Acum vă voi arăta cât de important este Sintaxa JavaScript... Eliminați „;” înainte de celălalt și codul va înceta imediat să funcționeze. De aceea, fii întotdeauna atent. Într-unul dintre articolele următoare, vă voi spune cum să prinzi erori în JavaScript.
O afirmație condițională poate fi inserată în alta. Să adăugăm o verificare a faptului că utilizatorul a introdus numărul „0”.

Acum vă voi arăta cum să verificați mai multe condiții. Există un „ȘI” logic (notat cu simbolurile &&). Există, de asemenea, un concept „SAU” logic(notat cu simboluri ||). „ȘI” logic are o prioritate mai mare, adică mai întâi, această condiție va fi verificată și apoi va fi verificat „SAU” logic.
Să vedem acest exemplu: să creăm un număr aleatoriu de la 1 la 10. Este necesar să afișăm sintagma „Numărul necesar =” și numărul în sine, dacă acest număr nu este 6 și mai mult de 5 sau mai mult de 1, dar mai puțin de 4:

În acest caz, numerele dorite sunt: ​​2,3,7,8,9,10. Alte numere nu corespund condiției.
Vreau, de asemenea, să vă atrag atenția asupra operatorului "! =", Care înseamnă "nu egal". În cele din urmă, atunci când stabiliți condiții, acordați întotdeauna atenție plasării parantezelor. Majoritatea greșelilor se datorează plasării lor incorecte.

Dacă programarea ar fi întotdeauna liniară, atunci, probabil, nu ar exista. Într-adevăr, în aproape orice program există diverse ramificații care depind de anumiți factori externi sau interni. Aceste ramuri sunt create folosind operatorii condiționați, despre care vă voi spune în acest articol.

Forma generală operator condiționat în JavaScript astfel de:

Dacă (condiție) (
// Bloc de declarații
}
altceva (
// Bloc de declarații
}

Cuvântul cheie este primul dacă care spune browserului că urmează declarația condițională. O condiție este indicată în interiorul parantezelor, care, în consecință, revine Adevărat sau fals... Dacă expresia dintre paranteze a fost Adevărat (cu adevărat), atunci primul bloc de instrucțiuni este executat dacă condiția fals (fals), apoi blocul de afirmații din altceva... De asemenea, blocați altceva este opțional și vă voi da un exemplu mai jos.

Să exersăm acum în practică. Să rezolvăm următoarea problemă: utilizatorul introduce un număr și afișăm un mesaj - indiferent dacă este mai mult sau mai puțin 5 .

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

Să ne uităm la acest exemplu. Cu prima linie, numim funcția prompt care afișează o fereastră care vă cere să introduceți un număr. Apoi, utilizatorul introduce un număr care este scris într-o variabilă X... Și apoi vine condiția, pe care o traduc astfel: Dacă x este mai mic de 5, atunci afișați mesajul: „Numărul introdus este mai mic de cinci”, în caz contrar afișați mesajul „Numărul introdus este mai mare de cinci”... Expresie X< 5 se întoarce fie Adevărat ( < 5 ) sau fals (x> = 5). Rețineți, de asemenea, că nu folosim aparate dentare. De ce? Deoarece folosim un singur operator (funcție alerta ()). În principiu, le putem pune și nimic nu se va schimba, totuși, aici vor fi de prisos.

Cu toate acestea, sarcina noastră conține o eroare semnificativă. Dacă utilizatorul introduce „ 5 ", apoi mesajul" Numărul introdus este mai mare de cinci"totuși, acest lucru nu este în totalitate corect. Deci, să transformăm condiția astfel:

Dacă (x< 5) alert ("Введённое число меньше пяти");
altceva
if (x == 5) alert („Ai introdus cinci”);
else alert („Numărul introdus este mai mare de cinci”);

După cum puteți vedea, blocul altcevaîn prima condiție a fost transformat. În bloc altceva este verificat pentru egalitatea de x și 5. Și dacă da, atunci se afișează un mesaj corespunzător, în caz contrar, se afișează că numărul este mai mare de cinci. Adică, o afecțiune într-o afecțiune este complet normală. De asemenea, rețineți că încă nu am pus aparate dentare ca dacă-altfel acesta este un singur operator. Și când există un singur operator, prezența parantezelor este opțională.

Să luăm un alt exemplu. Să creăm o variabilă care va fi Adevărat dacă numărul introdus este pozitiv și fals dacă numărul este negativ.

Var x = prompt („Introduceți un număr”);
var pozitiv = adevărat;
dacă (x< 0) positive = false;
alert (pozitiv);

Acest exemplu folosește un exemplu clasic, când luăm o variabilă și îi atribuim o valoare implicită. Și dacă este necesar, atunci ne schimbăm. În acest caz, modificăm valoarea implicită dacă numărul este negativ. Cu toate acestea, acest exemplu ar fi putut fi scris și mai frumos:

Var x = prompt („Introduceți un număr”);
var pozitiv = x< 0;

Cu alte cuvinte, suntem variabili pozitiv atribuiți imediat rezultatul comparației Xși zgârieturi.

Acum să vorbim despre așa-numitul condiții dificile... În exemplele de mai sus, am considerat doar condiții simple, cu toate acestea, există și alte condiții care constau în mai multe condiții. Și există două operații utilizate aici: && - logic ȘIși || - OR logic... Să scriem o astfel de condiție:

Dacă ((x<= 5) && (x >= 0)) (// bloc de operatori)

Această condiție (condiție complexă) va da Adevărat, dacă și numai dacă X<= 5 И x >= 0 ... În caz contrar, se va întoarce fals.

Luați în considerare o condiție complexă cu OR logic.

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

O puteți traduce astfel: dacă X<= 5 ИЛИ x == 6 apoi întoarce-te Adevărat, in caz contrar fals.

Ultimul lucru pe care vreau să-l spun este că există condiții din care constă multiple AND ȘI OR, și, uneori, trebuie să vă strângeți capul foarte serios pentru a înțelege o astfel de afecțiune.

Asta e tot ce am vrut să spun declarații condiționale în JavaScript... Și atunci ai nevoie doar de practică. Din păcate, fără practică, nu veți învăța niciodată să utilizați acest operator, fără de care este pur și simplu inutil să mergeți mai departe. Deci, veniți cu o problemă simplă (cum ar fi cea pe care am rezolvat-o mai sus) și rezolvați-o.

JavaScript - Lecția 7. Filiale ale programului - Declarație If

Foarte des apare o situație când trebuie să efectuăm o acțiune în funcție de o afecțiune. De exemplu, avem un magazin de haine online. Întrebăm utilizatorul cine este (bărbat sau femeie) și, în funcție de răspuns, afișăm o listă cu produsele corespunzătoare (bărbat sau femeie). Când scrieți astfel de programe, este folosit afirmație condițională if... Sintaxa sa este următoarea:

Dacă B (S1)
altceva (S2)

Unde B este o expresie de tip logic și S1și S2- operatorii.

Funcționează astfel: se calculează valoarea expresiei B, dacă este adevărat, atunci operatorul este executat S1, dacă este fals, atunci operatorul este executat S2... Şir altceva (S2) poate fi omis.

Cred că un exemplu o va clarifica. Să presupunem că avem un formular în care utilizatorul introduce 3 valori. Să scriem un script care va determina maximul numerelor introduse.

Mai întâi, să scriem codul formularului în pagina html:

Javascript dacă

Acum, pe pagina script.js, scrieți codul funcției:

function 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; dacă (c> m) m = c; obiect.res.value = m;)

Deci, funcția noastră ia trei valori din formă, pentru maxim ( m) luăm valoarea A... Apoi comparăm: dacă valoarea b mai mare decât maximul (adică A), atunci maximul devine b, altfel maximul rămâne A(deoarece expresia dintre paranteze nu este adevărată). Apoi, comparați în mod similar următoarea valoare c cu maximul. Ieșim răspunsul în câmpul rezultat ( rez).

În general, un astfel de scenariu ar putea fi scris folosind metoda max obiect Matematica luate în considerare în ultima lecție, iar codul ar fi mai scurt:

function 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);)

Aceasta vreau să spun că programarea este încă un proces creativ și o problemă poate fi rezolvată în moduri diferite. Sarcina programatorului este de a găsi cea mai optimă opțiune. Dar așa este, o digresiune lirică. Să ne întoarcem la declarația if și să privim un exemplu mai interesant. Să scriem un script, în timpul căruia operațiunea, când plasați cursorul mouse-ului peste imagine, acesta va crește, creând un efect de zoom.

După cum vă amintiți în HTML, puteți seta dimensiunea imaginii inserate. Dacă dimensiunile specificate sunt mai mari sau mai mici decât originalul, atunci browserul va potrivi automat originalul la aceste dimensiuni. Aceasta este ceea ce vom folosi. Să avem o imagine de genul acesta:

Originalul are o lățime de 302 pixeli. Vrem ca imaginea de pe pagină să aibă o lățime de 102 pixeli, iar la plimbare, să crească la 302 pixeli. Totul este clar cu pagina html:

Javascript dacă

Și în funcția noastră, pe lângă operatorul condițional, vom folosi și funcția standard javascript setTimeout care apelează o funcție definită de utilizator cu o anumită perioadă de timp:

Funcția bigPict () (var w = document.tigr.width; if (w Astfel, funcția verifică lățimea imaginii ( lăţime) și, dacă are mai puțin de 302 pixeli, crește această lățime cu 10 pixeli. Funcţie setTimeout ne cheamă funcția bigPict la fiecare jumătate de secundă, datorită căreia dimensiunea imaginii va crește atâta timp cât starea w nu va deveni fals.

Pentru a face vizuală aproximarea mai lină, încercați să micșorați pasul de creștere și timpul de apelare a funcției. Joacă-te cu aceste numere și găsește-le pe cele mai bune.

Asta este tot pentru astăzi, ca temă, adăugați scriptul nostru, astfel încât imaginea, la ieșirea cursorului mouse-ului, să revină la valorile sale originale (adică 102 pixeli). Dacă nu funcționează, descărcați