Nesting For Loops σε JavaScript

Εάν αντιμετωπίζετε προβλήματα με την κατανόηση της πρόκλησης Nesting For Loops του FreeCodeCamp, μην ανησυχείτε. Έχουμε την πλάτη σας.

Σε αυτό το πρόβλημα πρέπει να ολοκληρώσετε τη multiplyAll()συνάρτηση και παίρνετε έναν πολυδιάστατο πίνακα ως όρισμα. Να θυμάστε ότι μια πολυδιάστατη σειρά, μερικές φορές ονομάζεται σειρά 2D, είναι απλώς μια σειρά από πίνακες, για παράδειγμα, [[1,2], [3,4], [5,6]].

Στο πρόγραμμα επεξεργασίας στα δεξιά, multiplyAll()ορίζεται ως εξής:

function multiplyAll(arr) { var product = 1; // Only change code below this line // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]); 

Πρέπει να ολοκληρώσετε τη συνάρτηση, ώστε να πολλαπλασιάζει τη productμεταβλητή με κάθε αριθμό στις υπο-σειρές της παραμέτρου arr, η οποία είναι ένας πολυδιάστατος πίνακας.

Υπάρχουν πολλοί διαφορετικοί τρόποι επίλυσης αυτού του προβλήματος, αλλά θα επικεντρωθούμε στην απλούστερη μέθοδο χρησιμοποιώντας forβρόχους.

Ρυθμίστε τους forβρόχους σας

Επειδή arrείναι ένας πολυδιάστατος πίνακας, θα χρειαστείτε δύο forβρόχους: ένας για να περάσετε από καθεμία από τις συστοιχίες υπο-συστοιχιών και ένας για να περιηγηθείτε στα στοιχεία σε κάθε υπο-πίνακα.

Περάστε τις εσωτερικές συστοιχίες

Για να το κάνετε αυτό, δημιουργήστε έναν forβρόχο όπως έχετε κάνει σε προηγούμενες προκλήσεις:

function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]); 

Σημειώστε ότι χρησιμοποιούμε letαντί varγια το βρόχο και για δήλωση product. Σε αυτήν την πρόκληση δεν θα παρατηρήσετε μια διαφορά μεταξύ των δύο, αλλά γενικά είναι καλή πρακτική να χρησιμοποιείτε ES6 constκαι letόποτε μπορείτε. Μπορείτε να διαβάσετε περισσότερα σχετικά με το γιατί σε αυτό το άρθρο.

Τώρα καταγράψτε κάθε μία από τις δευτερεύουσες συστοιχίες στην κονσόλα:

function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { console.log(arr[i]); } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]); 

Επειδή είστε καλώντας multiplyAll()με [[1,2],[3,4],[5,6,7]]στο κάτω μέρος, θα πρέπει να δείτε τα ακόλουθα:

[ 1, 2 ] [ 3, 4 ] [ 5, 6, 7 ]

Περάστε τα στοιχεία σε κάθε δευτερεύουσα σειρά

Τώρα πρέπει να ελέγξετε κάθε αριθμό στις υπο-συστοιχίες που μόλις συνδεθήκατε στην κονσόλα.

Αφαιρέστε console.log(arr[i]);και δημιουργήστε έναν άλλο forβρόχο μέσα σε αυτόν που μόλις γράψατε:

function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { for (let j = 0; j < arr[i].length; j++) { } } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]); 

Να θυμάστε ότι, για τον εσωτερικό βρόχο, θα πρέπει να ελέγξετε το .lengthτου arr[i]επειδή arr[i]είναι μία από τις υπο-συστοιχίες εξετάσαμε νωρίτερα.

Συνδεθείτε τώρα arr[i][j]στην κονσόλα για να δείτε καθένα από τα μεμονωμένα στοιχεία:

function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { for (let j = 0; j < arr[i].length; j++) { console.log(arr[i][j]); } } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]); 
1 2 3 4 5 6 7

Τέλος, πολλαπλασιάστε productμε κάθε στοιχείο σε κάθε μία από τις δευτερεύουσες συστοιχίες:

function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { for (let j = 0; j < arr[i].length; j++) { product *= arr[i][j]; } } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]);

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

function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { for (let j = 0; j < arr[i].length; j++) { product *= arr[i][j]; } } // Only change code above this line console.log(product); return product; } multiplyAll([[1,2],[3,4],[5,6,7]]);
6 // [[1], [2], [3]] 5040 // [[1, 2], [3, 4], [5, 6, 7]] 54 // [[5, 1], [0.2, 4, 0.5], [3, 9]]

Μια πιο προσεκτική ματιά

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

Σε τέτοιες περιπτώσεις, μπορεί να είναι χρήσιμο να καταγράψετε κάτι πιο λεπτομερές στην κονσόλα. Επιστρέψτε στον κωδικό σας και συνδεθείτε `Sub-array ${i}: ${arr[i]}`στην κονσόλα λίγο πριν τον εσωτερικό forβρόχο:

function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { console.log(`Sub-array ${i}: ${arr[i]}`); for (let j = 0; j < arr[i].length; j++) { product *= arr[i][j]; } } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]);

Στον εξωτερικό forβρόχο, κάθε επανάληψη περνά μέσα από τις υπο-σειρές μέσα arr. Θα πρέπει να το δείτε στην κονσόλα:

Sub-array 0: 1,2 Sub-array 1: 3,4 Sub-array 2: 5,6,7

Λάβετε υπόψη ότι χρησιμοποιούμε τα παραπάνω γράμματα προτύπων. `Sub-array ${i}: ${arr[i]}`είναι το ίδιο όπως 'Sub-array ' + i + ': ' + arr[i], πολύ πιο εύκολο να γράψετε.

Τώρα στον εσωτερικό forβρόχο, συνδεθείτε `Element ${j}: ${arr[i][j]}`στην κονσόλα:

function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { console.log(`Sub-array ${i}: ${arr[i]}`); for (let j = 0; j < arr[i].length; j++) { console.log(`Element ${j}: ${arr[i][j]}`); product *= arr[i][j]; } } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]);

Ο εσωτερικός forβρόχος περνά από κάθε στοιχείο σε κάθε δευτερεύουσα συστοιχία ( arr[i]), οπότε θα πρέπει να το δείτε στην κονσόλα:

Sub-array 0: 1,2 Element 0: 1 Element 1: 2 Sub-array 1: 3,4 Element 0: 3 Element 1: 4 Sub-array 2: 5,6,7 Element 0: 5 Element 1: 6 Element 2: 7

Η πρώτη επανάληψη του iαρπάζει το πρώτο υπο-συστοιχίας, [1, 2]. Στη συνέχεια, η πρώτη επανάληψη του jπερνά μέσα από κάθε στοιχείο σε αυτόν τον δευτερεύοντα πίνακα:

// i is 0 arr[0] // [1, 2]; // j is 0 arr[0][0] // 1 // j is 1 arr[0][1] // 2 ----- // i is 1 arr[1] // [3, 4] // j is 0 arr[1][0] // 3 // j is 1 arr[1][1] // 4 ...

Αυτό το παράδειγμα είναι πολύ απλό, αλλά arr[i][j]μπορεί να είναι δύσκολο να γίνει κατανοητό χωρίς να καταγραφούν πολλά πράγματα στην κονσόλα.

Μια γρήγορη βελτίωση που μπορούμε να κάνουμε είναι να δηλώσουμε μια subArrayμεταβλητή στον εξωτερικό forβρόχο και να την ορίσουμε ίση με arr[i]:

function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { const subArray = arr[i]; for (let j = 0; j < arr[i].length; j++) { product *= arr[i][j]; } } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]); 

Στη συνέχεια, απλώς κάντε μερικές τροποποιήσεις στον κώδικα για να χρησιμοποιήσετε τη νέα subArrayμεταβλητή αντί arr[i]:

function multiplyAll(arr) { let product = 1; // Only change code below this line for (let i = 0; i < arr.length; i++) { const subArray = arr[i]; for (let j = 0; j < subArray.length; j++) { product *= subArray[j]; } } // Only change code above this line return product; } multiplyAll([[1,2],[3,4],[5,6,7]]); 

Αυτό πρέπει να είναι ό, τι πρέπει να ξέρετε για πολυδιάστατες συστοιχίες και ένθετους forβρόχους. Τώρα βγείτε εκεί και επαναλάβετε τα καλύτερα!