Επαναλήψεις σε στοιχεία Πίνακα

Ο κλασσικός τρόπος για να προσπελάσουμε τα στοιχεία ενός πίνακα είναι με τη χρήση της επανάληψης for. Ο παρακάτω κώδικας εμφανίζει τα στοιχεία ενός πίνακα:

const fruits = ['Apple', 'Banana', 'Orange'];

for (let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

Παρατηρήστε ότι χρησιμοποιούμε την μέθοδο length για να πάρουμε το μήκος του πίνακα, και τη μεταβλητή i για να προσπελάσουμε τα στοιχεία του πίνακα.

for ... of

Η δομή for ... of είναι μια εναλλακτική επιλογή για να προσπελάσουμε τα στοιχεία ενός πίνακα. Είναι πιο σύντομη και ευανάγνωστη από την επανάληψη for, και είναι προτιμότερη όταν δεν μας ενδιαφέρει η σειρά των στοιχείων.

Ο παρακάτω κώδικας εμφανίζει τα στοιχεία ενός πίνακα με τη χρήση της δομής for ... of:

const fruits = ['Apple', 'Banana', 'Orange'];

for (const fruit of fruits) {
    console.log(fruit);
}

Η σύνταξη της δομής for ... of είναι πιο απλή από την επανάληψη for, καθώς δεν χρειάζεται να χρησιμοποιήσουμε τη μέθοδο length ή μια μεταβλητή για τον έλεγχο της επανάληψης.

Χρησιμοποιούμε μία μεταβλητή (fruit στο παραπάνω παράδειγμα) για να προσπελάσουμε τα στοιχεία του πίνακα.

for ... in

Η δομή for ... in είναι ακόμα μια εναλλακτική για να προσπελάσουμε τα στοιχεία ενός πίνακα. Επαναλαμβάνει τις ιδιότητες ενός αντικειμένου, συμπεριλαμβανομένων των ιδιοτήτων που κληρονομεί από το πρωτότυπο αντικείμενο.

Ο παρακάτω κώδικας εμφανίζει τα στοιχεία ενός πίνακα με τη χρήση της δομής for ... in:

const fruits = ['Apple', 'Banana', 'Orange'];

for (const index in fruits) {
    console.log(fruits[index]);
}

Στο παραπάνω παράδειγμα, η δομή for ... in εμφανίζει τα στοιχεία του πίνακα fruits.

Η δομή for ... in είναι πιο κατάλληλη για να προσπελάσουμε τις ιδιότητες ενός αντικειμένου, και όχι τα στοιχεία ενός πίνακα. Για να προσπελάσουμε τα στοιχεία ενός πίνακα, προτιμήστε τη δομή for ... of.