Re:Javascript and CSS best practices for better performance
by webuiarchitect on Wednesday June 16, 2010 @01:58PM
(#1436410)
for-loop does create a scope. In fact, every statement block is a scope in itself.
In your examples, just change the value of variable 'a' to 100 or 1000 and you will see the difference.
Re:Javascript and CSS best practices for better performance
by jaysoo on Wednesday June 16, 2010 @04:37PM
(#1436947)
Blocks in JavaScript do not create scopes. This is different from many other languages (like Java or C).
In fact, Crockford has mentioned this as well: http://javascript.crockford.com/code.html
"JavaScript does not have block scope, so defining variables in blocks can confuse programmers who are experienced with other C family languages."
Which is why this code works:
(function() {
for (var i=0; i<100; i++);
alert(i);
Notice the variable `i` is accessible from outside the for-loop.
Re:Javascript and CSS best practices for better performance
by webuiarchitect on Thursday June 17, 2010 @02:10AM
(#1438119)
That's correct. Thanks a lot. Updated the blog with the correct example (using function). I was testing on Chrome and even your examples showed better results with value of variable 'a' to 1000, although slightly. Firefox shows no difference.
Another thing, JavaScript 1.7 has introduced block level scopes.. you can achieve that by using the 'let' keyword instead of 'var' to declare a variable. Although most browsers don't support it yet.
For example, if you ran the code below in FireBug you'll get the same results (minor variance aside).
function foo() { var a = 0; for (var i=0, j=a; i<10000000; i++) { var x = j+i; } }
function bar() { var a = 0; for (var i=0; i<10000000; i++) { var x = a+i; } }
(function() { var start = new Date().getTime(), end; foo(); end = new Date().getTime(); console.log(end-start); })();
(function() { var start = new Date().getTime(), end; bar(); end = new Date().getTime(); console.log(end-start); })();