why var declaration fast than let

Question

'use strict'

function test() {
  let t = Date.now();
  let p = 0;
  for (let i = 0; i < 100000000; i++) {
    p += i % 2;
  }
  console.log(p)
  console.log('test: ', Date.now() - t);
}

function test1() {
  var t = Date.now();
  var p = 0;
  for (var i = 0; i < 100000000; i++) {
    p += i % 2;
  }
  console.log(p)
  console.log('test1 : ', Date.now() - t);
}

test();
test1();

run the code above in chrome, why test1 is fast than test. is the let' fault or my fault?

50000000
test:  1146

50000000
test1 :  148

In Firefox, I do not see that behavior. I get around 100 milliseconds for both functions. — Pointy, Apr 25 '16 at 17:40
I doubt anyone but a Chrome developer could answer this question, and I doubt the usefulness of understanding this particular quirk of Chrome's implementation of scoping internals (but I admit I may be wrong). — apsillers, Apr 25 '16 at 17:43
`let` forces the creation of an additional scope. There's likely going to be some time lost in creating that. — Jonathan Lonowski, Apr 25 '16 at 17:44
But you would think that creating the scope for the `for` loop (or deleting the reference after it) would be done only _once_, taking up a negligible amount of time. — Sebastian Simon, Apr 25 '16 at 17:47
What do you expect instead? `var` and `let` are doing two different things here, `let` involving more resource allocation. Also `let` may not be as optimized yet since it's relatively new. — Felix Kling, Apr 25 '16 at 18:00
@Xufox Every pass through the `for` loop with `let` creates a new execution environment in the general case. In your specific example, that may not be the case, but `let` is a brand new feature, even if there are optimizations that can be done, they likely haven't been done yet. — loganfsmyth, Apr 25 '16 at 19:39
@apsillers this is not just a quirk of Chrome, the issue also exists in node, and possibly in Firefox as well. See http://stackoverflow.com/questions/37792934/why-is-let-slower-than-var-in-a-for-loop-in-nodejs and run the stack snippet in Firefox to see if that is true, as I'm not entirely certain. — Patrick Roberts, Jun 13 '16 at 17:08

score 3 · Accepted Answer · edited May 23 '17 at 11:58

It might be worth mentioning that in es6 the let keyword in a for-loop has been designed to solve the notorious closure in a loop problem in JavaScript:

var log = msg => div.innerHTML += msg + "<br>";

for (var i=0; i < 3; i++) {
  Promise.resolve().then(() => log(i)); // 3, 3, 3
}
for (let i=0; i < 3; i++) {
  Promise.resolve().then(() => log(i)); // 0, 1, 2
}

<div id="div"></div>

As @loganfsmyth mentions in comments, it does this by effectively creating a new closure for each iteration of the loop.

This, and the fact that the feature is new, might account for some of the performance difference seen in Chrome. That said, there seems to be no difference in Firefox for your particular example, so it seems possible for browsers to optimize this.

why var declaration fast than let

1 Answers1

Linked