Μετατροπή τύπων σε

Σχετικά με την έννοια Μετατροπή τύπων

Στη JavaScript, οι τιμές μπορεί να είναι διαφορετικών τύπων. Μπορείς να αλλάξεις τον τύπο μιας μεταβλητής με ρητή μετατροπή τύπου. Εκτός από αυτό, η JavaScript εκτελεί και εξαναγκασμό τύπου (έμμεση μετατροπή τύπου) όταν το πλαίσιο το απαιτεί.

Μετατροπή τύπου

Η JavaScript δεν διαθέτει κάποια κατασκευή για να κάνεις cast σε έναν (διαφορετικό) τύπο, όπως πολλές άλλες γλώσσες, αλλά αντ' αυτού μπορείς να χρησιμοποιήσεις κάποιους ενσωματωμένους βοηθούς. Πιο συγκεκριμένα, τα καθολικά αντικείμενα Boolean, Number και String μπορούν να χρησιμοποιηθούν ως συναρτήσεις για να μετατρέψουν μια τιμή στον αντίστοιχο τύπο.

Μετατροπή σε Boolean (τιμές truthy/falsy)

Με το Boolean(value) μπορείς να μετατρέψεις οποιαδήποτε τιμή σε boolean. Πώς λειτουργεί αυτό;

Υπάρχει ένα συγκεκριμένο σύνολο τιμών, οι λεγόμενες falsy τιμές, που μετατρέπονται σε false. Το πιο σημαντικό είναι ότι τα false, 0, η κενή συμβολοσειρά, το null, το undefined και το NaN είναι falsy. Το άρθρο του MDN για το "Falsy" δείχνει την πλήρη λίστα.

Για όλες τις άλλες τιμές, το Boolean επιστρέφει true. Αυτές οι τιμές ονομάζονται truthy.

Boolean(-1);
// => true

Boolean(0);
// => false

Boolean(' ');
// => true

Boolean('');
// => false

Σημείωσε ότι, λόγω των κανόνων που περιγράφηκαν, τα '0', 'false', [] και {} είναι truthy στη JavaScript.

Μετατροπή σε αριθμό

Το Number(value) μπορεί να χρησιμοποιηθεί για να μετατρέψεις μια τιμή σε αριθμό. Τα κενά διαστήματα στην αρχή και στο τέλος μιας συμβολοσειράς αγνοούνται και μια κενή συμβολοσειρά μετατρέπεται σε 0. Αν προσπαθήσεις να μετατρέψεις μια μη πρωτογενή τιμή ή μια συμβολοσειρά που δεν αναπαριστά αριθμό, κανένα σφάλμα δεν θα πεταχτεί. Αντ' αυτού, το αποτέλεσμα είναι NaN (Not-A-Number).

Number('  -12.34  ');
// => -12.34

Number('1,2');
// => NaN

Number('1 2');
// => NaN

Number('');
// => 0

Number('10e3');
// => 10000

Number({ key: '123' });
// => NaN

Παρακάτω μπορείς να δεις τι επιστρέφει το Number για άλλες πρωτογενείς τιμές.

Number(true);
// => 1

Number(false);
// => 0

Number(null);
// => 0

Number(undefined);
// => NaN

Σημείωσε ότι, σε αντίθεση με το τελευταίο παράδειγμα, το Number() που καλείται χωρίς κανένα όρισμα έχει οριστεί να επιστρέφει 0.

Η JavaScript παρέχει επίσης τις συναρτήσεις parseInt και parseFloat. Εφαρμόζουν πιο χαλαρούς κανόνες ως προς το ποιες συμβολοσειρές μπορούν να μετατραπούν σε αριθμό. Γι' αυτό, καλύτερα να προτιμάς το Number ως συνάρτηση μετατροπής, για να αποφύγεις απρόσμενα αποτελέσματα.

parseInt('123a45');
// => 123

Number('123a45');
// => NaN

Μετατροπή σε συμβολοσειρά

Με το String(value) μπορείς να μετατρέψεις μια τιμή σε συμβολοσειρά. Το αποτέλεσμα είναι αυτό που θα περίμενες για πρωτογενείς τιμές.

String(12.34);
// => '12.34'

String(false);
// => 'false'

String(null);
// => 'null'

String(undefined);
// => 'undefined'

Για τους πίνακες, η συνάρτηση String εφαρμόζει τη μετατροπή σε συμβολοσειρά για κάθε στοιχείο και ενώνει τα αποτελέσματα με κόμμα. Μπορείς επίσης να εφαρμόσεις μόνος σου τη μέθοδο join, π.χ. για να προσαρμόσεις το διαχωριστικό. Ωστόσο, σε αυτές τις περιπτώσεις το null και το undefined θα μετατραπούν σε κενή συμβολοσειρά.

String([42, null, true, 'abc']);
// => '42,,true,abc'

Για τα αντικείμενα, από προεπιλογή το String επιστρέφει ένα κείμενο που δεν βοηθάει και πολύ.

String({ key: 'value' });
// => '[object Object]'

Μπορείς να προσαρμόσεις τη συμπεριφορά της μετατροπής, π.χ. παρέχοντας μια μέθοδο toString. Η ενότητα "Μετατροπή αντικειμένου σε πρωτογενή τύπο" στο javascript.info εξηγεί τις λεπτομέρειες.

Ένας άλλος συνηθισμένος τρόπος για να πετύχεις μια καλύτερη αναπαράσταση σε συμβολοσειρά για αντικείμενα και πίνακες είναι να χρησιμοποιήσεις την κωδικοποίηση JSON. Μπορείς να μετατρέψεις σε συμβολοσειρά με το JSON.stringify και πίσω σε αντικείμενο ή πίνακα με το JSON.parse.

const obj = {
  name: 'Gilda Guerra',
  address: {
    city: 'Goiânia',
  },
};

JSON.stringify(obj);
// => '{"name":"Gilda Guerra","address":{"city":"Goiânia"}}'

Εξαναγκασμός τύπου

Σε ορισμένα πλαίσια, η JavaScript μετατρέπει αυτόματα μια τιμή σε άλλον τύπο δεδομένων προτού αξιολογήσει κάποια εντολή. Αυτή η έμμεση μετατροπή ονομάζεται εξαναγκασμός τύπου.

Πλαίσιο boolean

Όταν μια τιμή χρησιμοποιείται σε πλαίσιο boolean, η JavaScript εφαρμόζει τους ίδιους κανόνες με τη συνάρτηση Boolean για να μετατρέψει την τιμή έμμεσα.

• Όταν η συνθήκη μιας εντολής if δεν είναι boolean, εφαρμόζεται εξαναγκασμός τύπου για να προσδιοριστεί αν η συνθήκη ικανοποιείται ή όχι. Το ίδιο ισχύει και για τον πρώτο τελεστέο του τριμερή τελεστή ?.

  const num = 0;
  if (num) {
    // this block is NOT executed because 0 is falsy
  }
  
  const name = 'Jin';
  name ? 'name was provided' : 'no name provided';
  // => 'name was provided'
  

• Ο τελεστέος του λογικού τελεστή NOT ! μετατρέπεται επίσης σε boolean προτού εφαρμοστεί η πράξη NOT.

  const name = '';
  !name;
  // => true
  

  Ένα αποτέλεσμα της συμπεριφοράς που περιγράφηκε είναι ότι το !!value έχει το ίδιο αποτέλεσμα με το Boolean(value). Ωστόσο, για λόγους αναγνωσιμότητας, καλύτερα να χρησιμοποιείς το Boolean.

• Η JavaScript εφαρμόζει επίσης εξαναγκασμό τύπου στους τελεστέους των λογικών τελεστών AND (&&) και OR (||). Αλλά να θυμάσαι ότι το αποτέλεσμα της έκφρασης δεν είναι απαραίτητα boolean. Επιστρέφει έναν από τους αρχικούς τελεστέους (δες το MDN για τους λογικούς τελεστές).

  null || 'hello';
  // => 'hello'
  

Πλαίσιο συμβολοσειράς

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

let name;
'hello ' + name;
// => 'hello undefined'

Η ίδια έμμεση μετατροπή συμβαίνει και για τιμές που δεν είναι συμβολοσειρές και ενσωματώνονται σε template strings.

const degrees = 23;
`It is ${degrees} °C`;
// => 'Is is 23 °C.';

Αριθμητικό πλαίσιο

Πολλοί τελεστές μετατρέπουν τους τελεστέους σε αριθμούς (αν χρειάζεται) σύμφωνα με τη λογική της συνάρτησης Number που εξηγήθηκε παραπάνω.

• Αριθμητικοί τελεστές: + (αν δεν εμπλέκεται συμβολοσειρά), -, *, /, %, **
• Τελεστές μονομερούς πρόσθεσης και μονομερούς άρνησης: +, -
• Τελεστές σύγκρισης (για τελεστέους που δεν είναι συμβολοσειρές): >, >=, <, <=
• Τελεστές δυαδικών ψηφίων: |, &, ^, ~

Δες τη λίστα τελεστών του MDN για περισσότερες λεπτομέρειες για οποιονδήποτε από αυτούς τους τελεστές.

Όταν ένας τελεστέος μπορεί δυνητικά να είναι συμβολοσειρά, το καλύτερο είναι να κάνεις πάντα ρητή μετατροπή με τη συνάρτηση Number, για να αποφύγεις λάθη.

'1' + '2';
// => '12'
// addition operator in string context as explained above

Number('1') + Number('2');
// => 3

Μερικές φορές θα δεις τον τελεστή μονομερούς πρόσθεσης να χρησιμοποιείται για να μετατρέψει μια συμβολοσειρά σε αριθμό. Αυτό δεν συνιστάται, γιατί είναι πολύ πιο δυσανάγνωστο από τη ρητή κλήση του Number.

const value = '42';
+value;
// => 42

Number(value);
// => 42

Η χρήση των τελεστών χαλαρής ισότητας και ανισότητας ==/!= συνεπάγεται επίσης συχνά μια έμμεση μετατροπή σε αριθμό. Ωστόσο, η ακριβής λογική αυτών των τελεστών είναι αρκετά περίπλοκη (δες το MDN για τη χαλαρή ισότητα). Τα αποτελέσματα είναι δύσκολο να προβλεφθούν και μερικές φορές δεν είναι αυτά που θα περίμενες. Χρησιμοποίησε αντ' αυτού τους τελεστές αυστηρής ισότητας/ανισότητας ===/!== για να αποφύγεις αυτές τις έμμεσες μετατροπές.