Repeating a Fixed Number of Times with for | CodeSignal Learn

Repeating a Fixed Number of Times with for | CodeSignal Learn

Introduction

So far, JavaScript has followed each line once unless a condition told it to skip a block. When we need the same action many times, we could copy and paste the line, but a program is easier to change when the repeated work appears once. A for loop tells JavaScript to run a block a fixed number of times. We will read the three parts of a for loop header: where the counter starts, the condition that keeps the loop going, and the update that moves the counter forward. We will also use the counter inside the block to number each pass.

A Loop Counts from 1 to 5

Here is a loop that prints five messages: JavaScript for (let i = 1; i <= 5; i = i + 1) {console.log(`Pass number ${i}`);} When we run it, the block runs once for each value of i from one through five: text Pass number 1 Pass number 2 Pass number 3 Pass number 4 Pass number 5 The loop header has three parts separated by semicolons. The first part, let i = 1, creates a counter named i and starts it at one. The second part, i <= 5, is checked before each pass. The loop keeps going while that condition is true. The third part, i = i + 1, updates the counter after each pass. The two semicolons are part of the for header, even though they are not at the ends of separate lines. They divide the setup, the keep-going question, and the update. The braces after the header begin the repeated block. We do not add a semicolon between the closing parenthesis and the opening brace, because the header and the block belong together as one loop statement. The name i is a common short name for a loop counter. The braces mark the repeated block, and the two spaces inside them show which instruction repeats. The variable i can be used inside the block, so our message changes on each pass.

Follow One Pass at a Time

We can trace the loop by following what happens in order. JavaScript creates i with the value 1 . It checks i <= 5; that is true, so it runs the block and prints Pass number 1 . Then it runs the update, making i equal to 2 . The condition is checked again, and the next pass prints Pass number 2 . This repeats for i equal to 3, 4, and 5 . After printing the fifth message, the update makes i equal to 6 . Now i <= 5 is false, so the block does not run again and the program continues after the loop. This explains why the final number is included: the condition is <= 5, which means “less than or equal to five.” The counter starts at one because this example numbers passes starting with one. A loop could instead begin at zero, or use a different limit; the three header parts define the exact sequence. When we are unsure about how many times a loop will run, tracing the first and last values is a reliable check. Here the first value is one and the last value that satisfies the condition is five, so there are five passes. Two header mistakes can prevent the loop from stopping. If we remove i = i + 1 from for (let i = 1; i <= 5; ...), the trace stays at 1, 1, 1, ...; the condition never becomes false. If we change the update to i = i - 1, the trace moves 1, 0, -1, ..., away from the upper limit. These are traces to inspect, not programs to run. We make sure the starting value, condition, and update work together to reach a point where the condition becomes false. For this beginner pattern, the update adds exactly one and the condition uses <= . We write out i = i + 1, matching the explicit reassignment style from the previous course. The full expression makes each step clear and is the form we use here. The useful result is the repeated work the block completed.

Sign up

Join the 1M+ learners on CodeSignal

Be a part of our community of 1M+ users who develop and demonstrate their skills on CodeSignal

Change the Start and Limit

The start and condition determine which values the counter takes. We can begin at ten and stop after twelve: for (let i = 10; i <= 12; i = i + 1) {console.log(i);} console.log("Done."); The counter takes the values ten, eleven, and twelve. Then the condition becomes false and the line after the loop runs: 101112 Done. The final console.log is outside the braces, so it runs one time after the loop finishes. This is just like the code after an if block: braces show exactly where the controlled section ends. We should keep the loop body focused on what happens once per count. The line after the loop describes what happens once overall. If we accidentally place that final line inside the braces, it would run on every pass instead of once at the end. Indentation does not change JavaScript's rules, but matching the braces visually helps us catch that kind of placement mistake.

The Full Program

Here is the full example, first counting from one to five, then counting from ten to twelve, and finally continuing after both loops: // Start i at 1, keep going while i is 5 or less, add 1 after each pass for (let i = 1; i <= 5; i = i + 1) {console.log(`Pass number ${i}`);} // Changing the start and the limit changes what gets printed for (let i = 10; i <= 12; i = i + 1) {console.log(i);} console.log("Done."); When we click Run, the first loop prints five labelled passes, the next prints three numbers, and the final line appears once: Pass number 1 Pass number 2 Pass number 3 Pass number 4 Pass number 5 101112 Done. Both loops use the same three-part shape. Only the starting value, the limit, and the block's work change.

The counter can stand for a quantity in a calculation. For example, we can show the cost of one, two, three, and four cups:

JavaScript

const pricePerCup = 4.5;

for (let i = 1; i <= 4; i = i + 1) {
  console.log(`Quantity ${i} costs ${i * pricePerCup} dollars.`);
}

Each pass multiplies the current cup count by the price, then places both values into the template literal:

text

Quantity 1 costs 4.5 dollars.
Quantity 2 costs 9 dollars.
Quantity 3 costs 13.5 dollars.
Quantity 4 costs 18 dollars.

The first line shows that a quantity of one costs one times the price. The important part is that a single block produces a line for each count. We could change the limit to six and the loop would add two more lines without duplicating the message.

The calculation uses the counter as the quantity. On the first pass, i * pricePerCup is 1 * 4.5; on the fourth, it is 4 * 4.5. The expression inside ${} is calculated before JavaScript builds the text, just as it was in our earlier template-literal lesson. This lets one short block describe a whole set of related values.

JavaScript

// Start i at 1, keep going while i is 5 or less, add 1 after each pass
for (let i = 1; i <= 5; i = i + 1) {
  console.log(`Pass number ${i}`);
}

// Changing the start and the limit changes what gets printed
for (let i = 10; i <= 12; i = i + 1) {
  console.log(i);
}

console.log("Done.");