Δήλωση διακόπτη JavaScript

Πίνακας περιεχομένων

    Εμφάνιση πίνακα περιεχομένων

Η δήλωση διακόπτης χρησιμοποιείται για την εκτέλεση διαφορετικών ενεργειών βάσει διαφορετικών συνθηκών.

Η δήλωση διακόπτης JavaScript

Χρησιμοποιήστε τη δήλωση διακόπτης για να επιλέξετε ένα από τα πολλά μπλοκ κώδικα που θα εκτελεστούν.

Σύνταξη

switch(expression) {
  case x:
     // code block
        break;
  case y:
     // code block
     break;
  default:
      // code block
 }

Ετσι δουλεύει:

  • Η έκφραση διακόπτη αξιολογείται μία φορά.

  • Η τιμή της έκφρασης συγκρίνεται με τις τιμές της κάθε περίπτωσης.

  • Εάν υπάρχει αντιστοιχία, εκτελείται το συσχετισμένο μπλοκ κώδικα.

  • Εάν δεν υπάρχει αντιστοίχιση, εκτελείται το προεπιλεγμένο μπλοκ κώδικα.

Παράδειγμα

Η μέθοδος getDay() επιστρέφει την ημέρα της εβδομάδας ως αριθμό μεταξύ 0 και 6.

(Κυριακή=0, Δευτέρα=1, Τρίτη=2 ..)

Αυτό το παράδειγμα χρησιμοποιεί τον αριθμό της ημέρας για να υπολογίσει το όνομα της ημέρας:

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";
}

Το αποτέλεσμα της ημέρας θα είναι:

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript switch</h2>

<p id="demo"></p>

<script>
let day;
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";
}
document.getElementById("demo").innerHTML = "Today is " + day;
</script>

</body>
</html>

Η λέξη-κλειδί διάλειμμα

Όταν η JavaScript φτάσει σε διάλειμμα λέξη-κλειδί, ξεφεύγει από το μπλοκ διακόπτη.

Αυτό θα σταματήσει την εκτέλεση μέσα στο μπλοκ διακόπτη.

Δεν είναι απαραίτητο να σπάσετε την τελευταία θήκη σε ένα μπλοκ διακόπτη. Το μπλοκ σπάει (τελειώνει) εκεί ούτως ή άλλως.

Σημείωση: Εάν παραλείψετε τη δήλωση break, η επόμενη υπόθεση θα εκτελεστεί ακόμα και αν η αξιολόγηση δεν ταιριάζει με την περίπτωση.

Η λέξη-κλειδί προεπιλογή

Η λέξη-κλειδί προεπιλεγμένη καθορίζει τον κώδικα που θα εκτελεστεί εάν δεν υπάρχει αντιστοίχιση υπόθεσης:

Παράδειγμα

Η μέθοδος getDay() επιστρέφει την ημέρα της εβδομάδας ως αριθμό μεταξύ 0 και 6.

Εάν σήμερα δεν είναι ούτε Σάββατο (6) ούτε Κυριακή (0), γράψτε ένα προεπιλεγμένο μήνυμα:

switch (new Date().getDay()) {
   
case 6:
      text = "Today is Saturday";
    break; 
  case 0:
      text = "Today is Sunday";
      break; 
   
default: 
      text = "Looking forward to the Weekend";
}

Το αποτέλεσμα του κειμένου θα είναι:

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript switch</h2>

<p id="demo"></p>

<script>
let text;
switch (new Date().getDay()) {
  case 6:
    text = "Today is Saturday";
    break;
  case 0:
    text = "Today is Sunday";
    break;
  default:
    text = "Looking forward to the Weekend";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Η περίπτωση προεπιλεγμένη δεν χρειάζεται να είναι η τελευταία περίπτωση σε έναν διακόπτη ΟΙΚΟΔΟΜΙΚΟ ΤΕΤΡΑΓΩΝΟ:

Παράδειγμα

switch (new Date().getDay()) {
  default: 
        text = "Looking forward to the Weekend";
    
  break;
  case 6:
        text = "Today is Saturday";
        break; 
  case 0:
        text = "Today is Sunday";
  }

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript switch</h2>

<p id="demo"></p>

<script>
let text;
switch (new Date().getDay()) {
  default:
    text = "Looking forward to the Weekend";
    break;
  case 6:
    text = "Today is Saturday";
    break;
  case 0:
    text = "Today is Sunday";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Εάν η προεπιλογή δεν είναι η τελευταία περίπτωση στο μπλοκ εναλλαγής, θυμηθείτε να τερματίσετε την προεπιλεγμένη περίπτωση με ένα διάλειμμα.

Κοινά μπλοκ κώδικα

Μερικές φορές θα θέλετε διαφορετικά αλλάξτε τις θήκες για να χρησιμοποιήσετε το ίδιο κώδικας.

Σε αυτό το παράδειγμα, η περίπτωση 4 και 5 μοιράζονται το ίδιο μπλοκ κώδικα και το 0 και 6 μοιράζονται άλλο μπλοκ κώδικα:

Παράδειγμα

switch (new Date().getDay()) {
  case 4:
  case 5:
    text = "Soon it is Weekend";
      break; 
  case 0:
  case 6:
      text = "It is Weekend";
    break;
  default: 
    text = "Looking forward to the Weekend";
  }

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript switch</h2>

<p id="demo"></p>

<script>
let text;
switch (new Date().getDay()) {
  case 4:
  case 5:
    text = "Soon it is Weekend";
    break;
  case 0:
  case 6:
    text = "It is Weekend";
    break;
  default:
    text = "Looking forward to the Weekend";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Εναλλαγή λεπτομερειών

Εάν πολλές περιπτώσεις ταιριάζουν με μια τιμή πεζών-κεφαλαίων, επιλέγεται η πρώτη περίπτωση.

Εάν δεν βρεθούν περιπτώσεις που να ταιριάζουν, το πρόγραμμα συνεχίζει στην ετικέτα προεπιλογή.

Εάν δεν βρεθεί προεπιλεγμένη ετικέτα, το πρόγραμμα συνεχίζει στις δηλώσεις μετά την αλλαγή.

Αυστηρή Σύγκριση

Οι περιπτώσεις εναλλαγής χρησιμοποιούν αυστηρή σύγκριση (===).

Οι τιμές πρέπει να είναι του ίδιου τύπου για να ταιριάζουν.

Μια αυστηρή σύγκριση μπορεί να ισχύει μόνο εάν οι τελεστές είναι του ίδιου τύπου.

Σε αυτό το παράδειγμα δεν θα υπάρχει αντιστοιχία για το x:

Παράδειγμα

 let x = "0";
switch (x) {
  case 0:
    text = "Off";
      break;
  case 1:
    text = "On";
    break;
    default:
    
  text = "No value found";
}

Δοκιμάστε το μόνοι σας →

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript switch</h2>

<p id="demo"></p>

<script>
let x = "0";

switch (x) {
  case 0:
    text = "Off";
    break;
  case 1:
    text = "On";
    break;
  default:
    text = "No value found";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>