function
or var declarations in nested blocks is not preferred JS-0016Function declarations (with the function
keyword) and variable declarations should preferably be in the root of a program or the body of a function.
Having nested function declarations inside blocks may have unexpected results at runtime due to hoisting.
As a rule of thumb, if you ever find yourself needing to use nested functions:
Prefer const f = () => ...
over function f() {...}
for functions inside block-statements.
When using function
or var
, do not have any declarations that can possibly be accessed outside the block in which they're declared.
Note: Block bindings (let
, const
) are not hoisted and therefore they are not affected by this rule.
function outer(test) {
if (test) {
// the declaration for "inner" can
// be accessed outside the if-statement
// only when `test` is truthy.
function inner() {
return "inner value";
}
inner();
}
// works only if `test` is true.
return inner();
}
outer(true); // "inner value"
outer(false); // TypeError: inner is not a function
inner
should be moved out of the if
block, or be declared with a const
keyword.
// When `inner` is needed outside the `if` block:
function outer(test) {
const inner = () => "inner value"
if (test) {
inner();
}
// always works.
return inner();
}
// When `inner` is not needed outside the `if` block:
function outer(test) {
if (test) {
const inner = () => "inner value"
inner();
}
return "outer value"
}