Making sense of nested loops

I had quite a difficult time trying to understand how a “for loop” worked while learning javascript. There were three statements that made up a for loop; setting the variable “i”, setting a condition that tells the loop to run, and incrementing or decrementing the variable “i”.

Below is what the code looks like broken out, with some explanation. Following that, you will see a cleaner version of a for loop.

It took me some time to realize that this block of code does exactly as it reads. let “i = 0” and while “i is less than 10”, run the block of code and increment “i” by 1. I wish I knew why this took me the better part of a program to comprehend, but it could have been due to the other variations of loops that can be used.

Now imagine what went through my head when I saw a for loop, followed by a second for loop. I was already lost on the first loop. It wasn’t till I started doing codewars (wish I had started every morning with a code war), that I was forced into a solution that required a nested for loop.

How I got comfortable with what a nested loop does was by understanding how a single loop worked. By creating the for loop above, and logging “i” in the console, I saw it logged numbers from 0–9.

This showed me that while “i” is at 0; 0 is logged, then “i” is increased by 1, and the console log code block is run again. Seems simple on its own, once you get a simple bit of code in the loop. Now, what happens when you add a second loop inside of the for loop?

From what I have read, the convention is to set the variable “j’ or “k”; below you will see my nested for loop function:

This looked very confusing to me until I logged both of my variables in the console. What I learned was that the first for loop will run with “i” at 0 and this will then run the second loop. It is in the first for loops block of code to run before the “i” variable is incremented. When I console logged “i” and “j” in the second loop, “j” is going to run through its code from 0–9, while the “i” variable is 0. It is not until the second loop is done that the first loop will increment and run the second loop in its entirety again. This will repeat itself until “i” is no longer less than 10.

Understanding how a nested for loop works was an exciting moment during my time programming. This has been a fun topic to learn and tinker with while I try to devise new ways to solve problems that may require nested loops.

--

--

--

Soon-to-be Flatiron School Successor, with an enthusiasm towards Front-End Web Development, lifelong learning, and continuous improvement.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Scrimper — Find the cheapest supermarket for your groceries

How to Choose Best Mobile App Development Services in 2021

Agile — A new way of working for Zomato

Network Services 2 — Try Hack Me Room

The perfect GIT Sync Script: Add, Commit and Push

Consistent Hashing

TutorCruncher December 18 Newsletter and 2018 Review!

CODESPHERE.COM —  IS NOW LIVE

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Jr Medina

Jr Medina

Soon-to-be Flatiron School Successor, with an enthusiasm towards Front-End Web Development, lifelong learning, and continuous improvement.

More from Medium

The PhD Journey.

Linking the Linked List

The use of imperial measurements outside of the classroom

How to Get a Job in the Intelligence Field