Sojin Samuel

Posted on Jul 5, 2022

Const is applicable on For of Loops but not on For Loops (Why)

#javascript #discuss #help #programming

I have seen people using const on for of loops, i admit why it doesnt work in the case of for loops but, does for of loop has the same case as that of for loops.

can you share your knowledge why const works on for of loops in javascript

Top comments (6)

Guilherme • Jul 6 '22

You didn't specify where in the loop, but I'm going to assume the obvious :)

in a for loop, you are creating a variable to count the iterations, and this variable is going to change, thus it can't be a constant value.

for (let i = 0; i < 5; i++) {}

if i were a const, it would throw an error at the end of the first iteration, when i++ was executed.

on for ... of loops, you create a variable to keep the value of the iterable (list) to use during that iteration of the loop... when it loops over, a new variable will be created, with the same name and different value. it does not try to reassign, it just releases the variable that was used in the last iteration and creates a whole new one.

for (const value of [1, 2, 3, 4]) {}

the value variable will only exist until the end of each iteration.

peerreynders • Jul 6 '22

The let in the modern for loop is actually a bit disingenuous.

The early version of the for loop worked like this:

for (var i = 0; i < 2; i += 1) {
  queueMicrotask(() => console.log(i));
}
// Output:
// 2
// 2

Unintuitive but correct as by the time console.log() executed i was 2.

Typically the intention is this:

for (var i = 0; i < 2; i += 1) {
  queueMicrotask(makeTask(i));
}
// Output:
// 0
// 1
function makeTask(v) {
  return () => console.log(v);
}

The let version automatically works that way

for (let i = 0; i < 2; i += 1) {
  queueMicrotask(() => console.log(i));
}
// Output:
// 0
// 1

A new lexical scope is created for each iteration and each lexical closure has its own copy of i.

for ([initialization]; [condition]; [final-expression])
  statement

initialization initializes the loop environment‡.
final-expression runs at the beginning of each iteration except the first one.
before condition is checked a new lexical environment is created for the iteration and the current loop environment (i) is copied into that then condition is checked. Continue if satisfied, break if not.
statement is executed.
the lexical environment is copied back to the loop environment.
goto step 2

for (let i = 0; i < 2; i += 1) {
  queueMicrotask(() => console.log(i));
  i += 1;
}
// Output:
// 1

‡ initialization has its own lexical scope.

for (let i = (queueMicrotask(() => console.log(i)), 0); i < 2; i += 1) {
  i += 1;
}
// Output:
// 0

Sojin Samuel • Jul 6 '22

Thanks Guilherme

amiceli • Jul 6 '22

For exemple with a for loop

for (const i = 0; i < 100; i++) {
// ....
}

You can't useconst because I++ will increment i.
But i is a constant. A constant can't change. So you have to use let

I don't know all details for for of loop, just it uses Iterator. I found a good article about loops details : exploringjs.com/es6/ch_for-of.html

Sojin Samuel • Jul 6 '22

Thanks 4 investing the time for helping me out amiceli

Adam Crockett 🌀 • Jul 6 '22

Genuinely good question!

DEV Community

Const is applicable on For of Loops but not on For Loops (Why)

Top comments (6)

Read next

An ancient and very capable MVC Javascript framework

What happens when you type a URL into your browser?

What You Possibly Don’t Know About Columnar Storage

When Are Layoffs Good?