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 switch
utasítás alapvetően helyettesítheti if
a 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- switch
nak egy vagy több case
blokkja 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
x
ellenőrizzük szigorú egyenlőség az értéket az elsőcase
(azazvalue1
), akkor a második (value2
), és így tovább. - Ha az egyenlőség megtalálható, akkor
switch
kezdje el végrehajtani a kódot a megfelelőtől kezdvecase
, a legközelebbi értékigbreak
(vagy a végéigswitch
). - Ha egyetlen eset sem felel meg, akkor a
default
kód végrehajtásra kerül (ha létezik).
Néhány igazi példa
- Egyszerű lejátszás és szünet kapcsoló
Az switch
utasí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 break
utasí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 switch
kezdik összehasonlítani average
az első case
változatot 4
. A mérkőzés kudarcot vall.
Akkor 8
. Ez egy mérkőzés, tehát a kivitelezés case 8
a legközelebbi időpontig kezdődik break
.
Ha nincs, break
akkor a végrehajtás a következővel folytatódik case
minden 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.
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!