How Does JavaScript Allow Function Use Before Definition? The Mystery of Hoisting Explained.

Function Declarations vs. Expressions: Unlocking the Mystery of Early Function Access in JavaScript

Despite its intuitive appearance, the ability to use a function before its definition in JavaScript has long bewildered developers. Consider the following code:

<code class="javascript">function fooCheck() {
  alert(internalFoo()); // Using internalFoo() before its definition

  return internalFoo(); // Still using it, despite its undefined status

  function internalFoo() { return true; } // Finally, the definition arrives
}

fooCheck();</code>

Curiously, this code executes without errors in all major browsers. To unravel this enigma, we turn to the concept of function declarations and expressions.

Function Declarations: Hoisting's Secret

The ключевое слово "function" in JavaScript creates a function declaration. Unlike function expressions, which are assignments, function declarations exhibit a unique characteristic: hoisting.

Hoisting is a syntactic trick that lifts the function identifier above all other statements in its scope, allowing it to be referenced even before its actual definition. In our example, the identifier "internalFoo" is hoisted, making it available for use at any point within the "fooCheck" function.

Early Function Access: A Consequence of Hoisting

The early access to "internalFoo" is a direct result of hoisting. The interpreter encounters the function declaration and assigns the identifier "internalFoo" a placeholder, allowing it to be referenced subsequently. Only when the interpreter reaches the function body does it execute the definition, creating the actual function.

Function Expressions: Different Rules Apply

In contrast to function declarations, function expressions follow normal top-down execution. They are evaluated when encountered, and their identifiers are not hoisted. This means that attempts to access a function expression before it is defined will result in an error.

Clarification in the ECMAScript Standard

The behavior of function declarations is explicitly defined in the ECMAScript standard (section 10.1.3). It states that function declarations are bound before any of their code-block's contents are executed, regardless of the function's position in the code.

The above is the detailed content of How Does JavaScript Allow Function Use Before Definition? The Mystery of Hoisting Explained.. For more information, please follow other related articles on the PHP Chinese website!