Προθεματικός και Μεταθεματικός Τύπος στη JavaScript

Στην πραγματικότητα, οι πράξεις αύξησης και μείωσης μπορούν να γραφτούν με δύο τρόπους. Ας εξετάσουμε αυτούς τους τρόπους χρησιμοποιώντας το παράδειγμα του ++, ενώ για το -- όλα θα είναι ανάλογα.

Στον πρώτο τρόπο, η πράξη γράφεται μετά από το όνομα της μεταβλητής, έτσι: a++, ενώ στον δεύτερο τρόπο - πριν από το όνομα της μεταβλητής, έτσι: ++a.

Η πρώτη μορφή ονομάζεται μεταθεματική, ενώ η δεύτερη - προθεματική. Ας δούμε σε ποιες περιπτώσεις εμφανίζεται η διαφορά μεταξύ αυτών των δύο μορφών.

Ας υποθέσουμε ότι έχουμε τον κώδικα alert(a++) και τον κώδικα alert(++a).

Στην περίπτωση του alert(a++) η μεταβλητή πρώτα εμφανίζεται και μετά αυξάνεται κατά ένα, ενώ στην περίπτωση του alert(++a) η μεταβλητή πρώτα αυξάνεται κατά ένα και μετά εμφανίζεται.

Στο επόμενο παράδειγμα, το πρώτο alert θα εμφανίσει 0, καθώς στην αρχή θα εκτελεστεί η εμφάνιση στην οθόνη, και μόνο μετά η μεταβλητή θα αυξηθεί:

javascriptlet num = 0;
alert(num++); // θα εμφανίσει 0
alert(num);   // θα εμφανίσει 1

Τώρα η μεταβλητή πρώτα θα αυξηθεί, και μετά θα γίνει η εμφάνιση στην οθόνη:

javascriptlet num = 0;
alert(++num); // θα εμφανίσει 1 - η μεταβλητή αυξήθηκε αμέσως

Αυτή η συμπεριφορά ισχύει όχι μόνο για την εμφάνιση στην οθόνη, αλλά και για την ανάθεση:

javascriptlet num1 = 0;
let num2 = num1++; // στη μεταβλητή num2 θα καταγραφεί 0
alert(num2); // θα εμφανίσει 0
alert(num1); // θα εμφανίσει 1 - η μεταβλητή num1 άλλαξε μετά την εγγραφή στο num2

Τώρα ας αλλάξουμε τη μεταθεματική μορφή σε προθεματική:

javascriptlet num1 = 0;
let num2 = ++num1; // στη μεταβλητή num2 θα καταγραφεί 1
alert(num2); // θα εμφανίσει 1

Εάν η πράξη μας εκτελείται σε ξεχωριστή γραμμή, τότε δεν υπάρχει διαφορά μεταξύ προθεματικής και μεταθεματικής μορφής:

javascriptlet num = 0;
++num;
num++;
alert(num); // θα εμφανίσει 2

javascriptlet num = 3;
alert(++num);

javascriptlet num = 3;
alert(num++);

javascriptlet num = 3;
alert(--num);

javascriptlet num = 3;
alert(num--);

javascriptlet num1 = 3;
let num2 = ++num1;
alert(num1);
alert(num2);

javascriptlet num1 = 3;
let num2 = num1++;
alert(num1);
alert(num2);

javascriptlet num1 = 3;
let num2 = --num1;
alert(num1);
alert(num2);

javascriptlet num1 = 3;
let num2 = num1--;
alert(num1);
alert(num2);

javascriptlet num1 = 3;
num1++;
let num2 = num1--;
alert(num1++);
alert(--num2);