Chrome调试器显示错误值

Question

I was debugging my js code on Chrome Ubuntu (Version 68.0.3440.106 64 bits) and I notice that the debugger is giving me wrong values, even if I watch the value by adding a watch expression entry.

for (let i = 0; i < visibility.show.or.length; ++i) {
   const currentVisibilityContext = visibility.show.or[i];
}

but if I use var instead of let it works fine

for (var i = 0; i < visibility.show.or.length; ++i) {
   const currentVisibilityContext = visibility.show.or[i];
}

Can any one explain to me this behavior? Thank you very much.

Answer 1

Variables declared with the var keyword can not have Block Scope.

Variables declared inside a block {} can be accessed from outside the block.

Example

{ 
    var x = 2; 
}
// x CAN be used here

Before ES2015 JavaScript did not have Block Scope.

Variables declared with the let keyword can have Block Scope.

Variables declared inside a block {} can not be accessed from outside the block:

Example

{ 
    let x = 2;
}
// x can NOT be used here

copied without problems from W3schools ofc

Answer 2

That's so weird. I get this when a console snippet is fired.

Is any of the properties of visibility, a observable property (like a KO observable) by any chance. Probably the debugger stepped into the observable property viz, function and is out of scope. Since everything is in one line, you get to see that debugger is executing a single command. Please try to split the line into multiple lines, to see how it behaves.