Do inner functions in JavaScript get hoisted? How

2019-01-12 04:57发布

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:

screenshot of Firefox console showing the error

Browser is Firefox. Fiddle here.

2条回答
Luminary・发光体
2楼-- · 2019-01-12 05:23

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.

查看更多
看我几分像从前
3楼-- · 2019-01-12 05:39
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.

查看更多
登录 后发表回答