Bevezetés a JavaScript kapcsoló esetekbe

Ebben a rövid cikkben gyakorlati példákkal ismertetem a JavaScript kapcsoló eseteit és azok használatát.

Ez a cikk gyakorlati példákkal magyarázza jobban, hogy segítsen megérteni a kapcsolási esetek mélységét.

Előfeltételek.

  • Alapvető JavaScript ismeretek
  • Kódszerkesztő
  • Böngésző
  • Az agyad :)

Egy switchutasítás alapvetően helyettesítheti ifa JavaScript többszörös ellenőrzését.

Leíróbb módot ad az érték összehasonlítására több változattal.

A kapcsoló szintaxisa

A- switchnak egy vagy több caseblokkja van, és választható alapértelmezett eset.

switch(x) { case 'value1': // if (x === 'value1') //code here [break] case 'value2': // if (x === 'value2') //code here [break] default: //code here [break] }
  • Az érték a xellenőrizzük szigorú egyenlőség az értéket az első case(azaz value1), akkor a második ( value2), és így tovább.
  • Ha az egyenlőség megtalálható, akkor switchkezdje el végrehajtani a kódot a megfelelőtől kezdve case, a legközelebbi értékig break(vagy a végéig switch).
  • Ha egyetlen eset sem felel meg, akkor a defaultkód végrehajtásra kerül (ha létezik).

Néhány igazi példa

  • Egyszerű lejátszás és szünet kapcsoló

Az switchutasítás több ágra is használható szám vagy karakterlánc alapján:

switch (movie) { case 'play': playMovie(); break; case 'pause': pauseMovie(); break; default: doNothing(); }

Ha nem ad hozzá egy breakutasítást, akkor a végrehajtás "átesik" a következő szintre. Elengedhetetlen, hogy szándékosan jelölje meg az esést egy megjegyzéssel, ha valóban a hibakeresés elősegítésére szánta:

switch (movie) { case 'play': // fallthrough case 'pause': pauseMovie(); break; default: doNothing(); }

Az alapértelmezett záradék nem kötelező. Kifejezései lehetnek mind a kapcsoló részben, mind a tokokban, ha úgy tetszik; összehasonlítás történik a kettő között az ===operátor segítségével:

switch (3 + 7) { case 5 + 5: correct(); break; default: neverhappens(); }
  • Egyszerű matematikai kalkulátor
let average = 2 + 6; switch (average) { case 4: alert( 'Too small' ); break; case 8: alert( 'Exactly!' ); break; case 10: alert( 'Too large' ); break; default: alert( "Incorrect values!" ); }

Itt switchkezdik összehasonlítani average az első caseváltozatot 4. A mérkőzés kudarcot vall.

Akkor 8. Ez egy mérkőzés, tehát a kivitelezés case 8a legközelebbi időpontig kezdődik break.

Ha nincs, breakakkor a végrehajtás a következővel folytatódik caseminden ellenőrzés nélkül.

Itt van egy példa break:

let average = 2 + 6; switch (average) { case 4: alert( 'Too small' ); case 8: alert( 'Exactly!' ); case 10: alert( 'Too big' ); default: alert( "Incorrect values!" ); }

A fenti példában három egymást követő végrehajtását láthatjuk alerts:

alert( 'Exactly!' ); alert( 'Too big' ); alert( "Incorrect values!" );
  • getDay () metódus kapcsoló eset

A getDay()módszer 0 és 6 közötti számként adja vissza a hétköznapot.

Vasárnap = 0, hétfő = 1, kedd = 2, szerda = 3, csütörtök = 4, péntek = 5, szombat = 6

Ez a példa a hétnap számát használja a hétnap nevének kiszámításához:

switch (new Date().getDay()) { case 0: day = "Sunday"; break; case 1: day = "Monday"; break; case 2: day = "Tuesday"; break; case 3: day = "Wednesday"; break; case 4: day = "Thursday"; break; case 5: day = "Friday"; break; case 6: day = "Saturday"; }

A nap eredménye az aktuális hétköznap lesz, napi formátumban

PS: Ez attól függően változna, amikor ezt a cikket olvassa

Ezt a cikket 2019.06.13-án írtam, amely csütörtök, így az eredmény a következő lenne:

Thursday

Az alapértelmezett kulcsszó

Az alapértelmezett kulcsszó határozza meg a futtatni kívánt kódot, ha nincs esetegyezés, inkább egy else utasítás:

switch (new Date().getDay()) { case 6: text = "Today is Saturday"; break; case 0: text = "Today is Sunday"; break; default: text = "Its not weekend yet!"; }

A szöveg eredménye:

Its not weekend yet!

Az alapértelmezett esetnek nem feltétlenül a kapcsolóblokk utolsó esetének kell lennie:

switch (new Date().getDay()) { default: text = "Its not weekend yet!"; break; case 6: text = "Today is Saturday"; break; case 0: text = "Today is Sunday"; }
Ha az alapértelmezett nem az utolsó eset a kapcsolóblokkban, ne felejtse el szünettel befejezni az alapértelmezett esetet.

Következtetés

Olyan sok gyakorlati példa van a kapcsolási esetekre, hogy áttérhet a google.com webhelyre, és gyorsan kereshet további kapcsolási esetekre vonatkozó példákat.

Ha ez a cikk segített, mutasd meg megosztással.

Köszönöm, hogy elolvasta!