Do inner functions in JavaScript get hoisted? How do the scoping rules apply to them?

Question

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.

Answer 1

if (…) {
    function …() {            
        …
    }
}

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.

Answer 2

The declaration of inner is hoisted to the top of the outer function. However, its value is only set if a == 1.

When outer() is called with a different value, the call to inner(456) fails as inner is still set to undefined.