Προχωρημένη δοκιμή / catch / τέλος σε Javascript και Typescript

Αντιμετώπιση σφαλμάτων σε Javascript & Typescript

Κάθε φορά που συμβαίνει σφάλμα κατά το χρόνο εκτέλεσης, «ρίχνεται» σε Javascript και Typescript, όπως συμβαίνει στις περισσότερες γλώσσες προγραμματισμού. Τα λάθη που δεν έχουν αντιμετωπιστεί θα οδηγήσουν σε διακοπή της εφαρμογής ή της υπηρεσίας σας, με αποτέλεσμα τη χειρότερη δυνατή εμπειρία χρήστη. Εάν συμβεί σφάλμα, χαθεί οποιαδήποτε μη αποθηκευμένη πρόοδος και οι χρήστες ενδέχεται να ξεκινήσουν μια μακρά διαδικασία (για παράδειγμα, εάν ένας χρήστης εγγράφηκε σε μια πλατφόρμα παρέχοντας πολλές πληροφορίες) ξανά. Το αποτέλεσμα είναι ότι αυτοί οι χρήστες πιθανότατα δεν θα χρησιμοποιήσουν ξανά το προϊόν σας ξανά, καθώς η εμπιστοσύνη έχει χαθεί.

Για την αντιμετώπιση τέτοιων περιπτώσεων, μπορεί να εντοπιστεί ένα σφάλμα. Για να εντοπίσετε σφάλματα στο Javascript και στο Typescript, απλώς τυλίξτε τον κώδικά σας σε ένα "try" -block, ακολουθούμενο από ένα "catch" -block.

async function getData(){
  try {
    // Call a dummy async 'fetch'-functoin
    const result = await fetch();
    return { result };
  } catch(error) {
    return { error };
  }
}

// ... later in your code ....

const { result, error } = await getData();

if (error){
  // ... handle error case.
}

// Access the results.

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

Ειδικός χειρισμός με το μπλοκ «τελικά»

Ως ένα επιπλέον βήμα για τον χειρισμό σφαλμάτων, το Javascript και το Typescript παρέχουν μια επιπλέον λέξη-κλειδί «τελικά». Ένα τέτοιο "τελικά" -μπλοκ εκτελεί οποιονδήποτε κώδικα εντός του πεδίου εφαρμογής του, αφού έχουν εκτελεστεί τόσο το "try" -block όσο και το "catch" -block (σε περίπτωση σφάλματος).

// This function is absolutely save
// to call. It fetches some data and 
// optionally catches a potential error.
//
// After everything's done, a 'finally'
// sends the error to our backend for logs,
// if there was any.
async function getData(){
  // In this case, we store the result
  // and error in mutable variables,
  // then return both.
  let result: Result;
  let error: Error;
  
  try {
    // Call a dummy async 'fetch'-function
    result = await fetch();
  } catch(e) {
    error = e;
  } finally {
    // After the whole try/catch has been
    // processed, we can log the error.
    if(error){
      await trackErrorInCloud(error);
    }
  }
  
  return { result, error };
}

// ... same as before ...

Αλλά περιμένετε, υπάρχουν περισσότερα! Γνωρίζατε ότι το "τελικά" - το μπλοκ εκτελείται ακόμα και αν επιστρέψετε ένα αποτέλεσμα στο "δοκιμή" - ή "πιάστε" - μπλοκ; Εδώ είναι ένα παράδειγμα αυτού που εννοώ με αυτό.

// Same as the example before, but
// now we directly return from within
// each code block. And this is where
// a side effect can happen.
async function getData(){
  try {
    const result = await fetch();
    return { result };
  } catch(error) {
    return { error }
  } finally {
    //
    // WATCH OUT!
    //
    // Just for demo purpose, but this
    // line of code will override both
    // the return in 'try' as well as 'catch'!
    //
    // Returning inside of 'finally' is therefore
    // dangerous and will lead to hard-to-debug 
    // issues.
    return { finally: true };
  }
}

// data === { finally: true }
const data = await getData();

// Here's a better use case for
// finally.
async function getData(){
  let error: Error;
  
  try {
    const result = await fetch();
    return { result };
  } catch(e) {
    error = e;
    return { error }
  } finally {
    // No return in finally,
    // so it's safe to use.
    if(error){
      await logInCloud()
    }
  }
}

// if no error === { result: ... }
// if error === { error: ... }
const data = await getData();

Περίληψη

Όπως έχετε δει, ο χειρισμός σφαλμάτων Javascript και Typescript είναι αρκετά εύκολος και αποφεύγει την πλήρη κατάρρευση της εφαρμογής σας. Ο ειδικός χειρισμός των αποτελεσμάτων επιστροφής στα μπλοκ "try" - και "catch" είναι καλό να γνωρίζετε όταν χρησιμοποιείτε το μπλοκ "επιτέλους", αλλά δεν πρέπει να κάνετε κατάχρηση για να αποφύγετε την εφαρμογή του κωδικού σας σε στυλ αντί-μοτίβου.