Πολλαπλό πάτημα στο κουμπί για εκκίνηση χρονομέτρου σε JavaScript

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

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

Για την επίλυση του προβλήματος που περιγράφηκε, απλά πρέπει να διασφαλιστεί ότι ένα επαναλαμβανόμενο πάτημα στο κουμπί δεν οδηγεί σε νέα εκκίνηση του χρονομέτρου. Για παράδειγμα, μπορεί κανείς μετά την έναρξη του χρονομέτρου να αποσυνδέσει από το κουμπί τον συνδεδεμένο χειριστή κλικ:

let start = document.querySelector('#start');

start.addEventListener('click', function func() {
	let i = 0;
	
	setInterval(function() {
		console.log(++i);
	}, 1000);
	
	this.removeEventListener('click', func); // αποσυνδέουμε τον χειριστή
});

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