I thought that JavaScript doesn't have block scope, but function scope, and that declarations are hoisted from their block to the top of their parent functions.
However, the following code does not work as expected:
function one(a) {
console.log("one called for " + a);
if (a == 1) {
function inner(b) {
console.log("inner called for " + b);
}
inner(123);
}
inner(456);
}
one(1);
one(2);
one(3);
The first one(1);
call proceeds normally, without any errors, however the execution stops when the second one(2);
is called.
This behavior is intuitive: the function inner
is defined only if a==1
.
But how is it consistent with the scoping/hoisting rules?
I thought its definition would be hoisted to the top of its scope, outside of the if
block which is supposed to have no effect!
Edit: here are the errors I am getting:
Browser is Firefox. Fiddle here.
The declaration of
inner
is hoisted to the top of the outer function. However, its value is only set ifa == 1
.When
outer()
is called with a different value, the call toinner(456)
fails asinner
is still set toundefined
.is invalid ECMAScript. Function declarations must be on the top level of function or program bodies, inside of blocks their behaviour is implementation-dependent. Firefox does execute this function statement conditionally, other browsers do hoist it like a normal function declaration. Move it outside the if-statement, or assign a function expression.