Ασύγχρονος κώδικας με callbacks σε JavaScript
Ας υποθέσουμε ότι έχουμε κάποια ασύγχρονη συνάρτηση:
function make() {
setTimeout(function() {
console.log('1');
}, 3000);
}
Ας υποθέσουμε ότι χρησιμοποιούμε αυτή τη συνάρτηση ως εξής:
make();
console.log('2'); // θα εκτελεστεί πρώτο
Ας υποθέσουμε ότι θέλουμε να κάνουμε έτσι ώστε η δεύτερη
εγγραφή στην κονσόλα να εκτελεστεί αφού
εκτελεστεί η ασύγχρονη πράξη
μέσα στη συνάρτηση.
Μία από τις προσεγγίσεις που χρησιμοποιούνται για αυτό,
είναι η χρήση callback:
ας τυλίξουμε τον κώδικα που περιμένει σε μια ανώνυμη συνάρτηση
και ας την περάσουμε ως παράμετρο στη συνάρτηση make:
make(function() {
console.log('2');
});
Φυσικά, αυτό από μόνο του δεν λύνει το
πρόβλημά μας. Προς το παρόν απλά κάναμε
την εξής συμφωνία: αν επιθυμείτε να εκτελέσετε κώδικα μετά
από την εκτέλεση της make, περάστε αυτόν τον κώδικα
ως callback στην κλήση της make.
Ας διορθώσουμε τον κώδικα της συνάρτησης make έτσι ώστε
να αρχίσει να λειτουργεί σύμφωνα με τη
συμφωνία μας:
function make(callback) {
setTimeout(function() {
console.log('1'); // κάποια ασύγχρονη πράξη, μπορεί να μην είναι μόνο μία
callback(); // μετά το callback μας
}, 3000);
}
Πείτε με ποια σειρά θα εμφανιστούν οι αριθμοί στην κονσόλα:
function make(callback) {
setTimeout(function() {
console.log('1');
callback();
}, 3000);
}
make(function() {
console.log('2');
console.log('3');
});