Σε αυτό το σεμινάριο, θα μάθετε για τη μέθοδο JavaScript setInterval () με τη βοήθεια παραδειγμάτων.
Στο JavaScript, ένα μπλοκ κώδικα μπορεί να εκτελεστεί σε καθορισμένα χρονικά διαστήματα. Αυτά τα χρονικά διαστήματα καλούνται συμβάντα χρονισμού.
Υπάρχουν δύο μέθοδοι για την εκτέλεση κώδικα σε συγκεκριμένα διαστήματα. Αυτοί είναι:
- setInterval ()
- setTimeout ()
Σε αυτό το σεμινάριο, θα μάθετε για τη setInterval()μέθοδο.
Σετ JavaScriptInterval ()
Η setInterval()μέθοδος επαναλαμβάνει ένα μπλοκ κώδικα σε κάθε δεδομένο συμβάν χρονισμού.
Η συνήθως χρησιμοποιούμενη σύνταξη του JavaScript setInterval είναι:
setInterval(function, milliseconds);
Οι παράμετροι του είναι:
- function - μια συνάρτηση που περιέχει ένα μπλοκ κώδικα
- χιλιοστά του δευτερολέπτου - το χρονικό διάστημα μεταξύ της εκτέλεσης της συνάρτησης
Η setInterval()μέθοδος επιστρέφει ένα intervalID που είναι θετικός ακέραιος.
Παράδειγμα 1: Εμφάνιση κειμένου μία φορά κάθε 1 δευτερόλεπτο
// program to display a text using setInterval method function greet() ( console.log('Hello world'); ) setInterval(greet, 1000);
Παραγωγή
Γεια στον κόσμο Γεια στον κόσμο Γεια στον κόσμο Γεια στον κόσμο Γεια στον κόσμο …
Στο παραπάνω πρόγραμμα, η setInterval()μέθοδος καλεί τη greet()συνάρτηση κάθε 1000 χιλιοστά του δευτερολέπτου ( 1 δευτερόλεπτο).
Ως εκ τούτου, το πρόγραμμα εμφανίζει το κείμενο Hello world μία φορά κάθε 1 δευτερόλεπτο.
Σημείωση : Η setInterval()μέθοδος είναι χρήσιμη όταν θέλετε να επαναλάβετε ένα μπλοκ κώδικα πολλές φορές. Για παράδειγμα, η εμφάνιση ενός μηνύματος σε σταθερό διάστημα.
Παράδειγμα 2: Χρόνος εμφάνισης κάθε 5 δευτερόλεπτα
// program to display time every 5 seconds function showTime() ( // return new date and time let dateTime= new Date(); // return the time let time = dateTime.toLocaleTimeString(); console.log(time) ) let display = setInterval(showTime, 5000);
Παραγωγή
"5:15:28 ΜΜ" "5:15:33 ΜΜ" "5:15:38 ΜΜ"….
Το παραπάνω πρόγραμμα εμφανίζει την τρέχουσα ώρα μία φορά κάθε 5 δευτερόλεπτα.
new Date()δίνει την τρέχουσα ημερομηνία και ώρα. Και toLocaleTimeString()επιστρέφει την τρέχουσα ώρα. Για να μάθετε περισσότερα σχετικά με την ημερομηνία και την ώρα, επισκεφθείτε την ημερομηνία και ώρα JavaScript.
Εκκαθάριση JavaScriptInterval ()
Όπως έχετε δει στο παραπάνω παράδειγμα, το πρόγραμμα εκτελεί ένα μπλοκ κώδικα σε κάθε καθορισμένο χρονικό διάστημα. Εάν θέλετε να διακόψετε αυτήν την κλήση λειτουργίας, τότε μπορείτε να χρησιμοποιήσετε τη clearInterval()μέθοδο.
Η σύνταξη της clearInterval()μεθόδου είναι:
clearInterval(intervalID);
Εδώ, intervalIDείναι η τιμή επιστροφής της setInterval()μεθόδου.
Παράδειγμα 3: Χρησιμοποιήστε τη μέθοδο clearInterval ()
// program to stop the setInterval() method after five times let count = 0; // function creation let interval = setInterval(function()( // increasing the count by 1 count += 1; // when count equals to 5, stop the function if(count === 5)( clearInterval(interval); ) // display the current time let dateTime= new Date(); let time = dateTime.toLocaleTimeString(); console.log(time); ), 2000);
Παραγωγή
4:47:41 ΜΜ 4:47:43 ΜΜ 4:47:45 ΜΜ 4:47:47 ΜΜ 4:47:49 ΜΜ
Στο παραπάνω πρόγραμμα, η setInterval()μέθοδος χρησιμοποιείται για την εμφάνιση του τρέχοντος χρόνου κάθε 2 δευτερόλεπτα. Η clearInterval()μέθοδος διακόπτει την κλήση λειτουργίας μετά από 5 φορές.
Μπορείτε επίσης να μεταβιβάσετε πρόσθετα ορίσματα στη setInterval()μέθοδο. Η σύνταξη είναι:
setInterval(function, milliseconds, parameter1,… .paramenterN);
Όταν περάσουν επιπλέον παραμέτρους στο setInterval()μέθοδο, αυτές οι παράμετροι ( parameter1, parameter2, κ.λπ.) θα περάσει στην καθορισμένη λειτουργία .
Για παράδειγμα,
// program to display a name function greet(name, lastName) ( console.log('Hello' + ' ' + name + ' ' + lastName); ) // passing argument to setInterval setInterval(greet, 1000, 'John', 'Doe');
Παραγωγή
Γεια John Doe Γεια John Doe Γεια John Doe….
Στο παραπάνω πρόγραμμα, δύο παράμετροι Johnκαι Doeμεταβιβάζονται στη setInterval()μέθοδο. Αυτές οι δύο παράμετροι είναι τα ορίσματα που θα μεταβιβαστούν στη συνάρτηση (εδώ, greet()συνάρτηση) που ορίζεται μέσα στη setInterval()μέθοδο.
Σημείωση: Εάν χρειάζεται μόνο να εκτελέσετε μια συνάρτηση μία φορά, είναι καλύτερα να χρησιμοποιήσετε τη μέθοδο setTimeout ().
