Home/ Questions/Q 8030547
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-05T00:48:20+00:00

If I do this in my <head> tag: <script type=text/javascript src=foo.js></script> And inside foo.js

  • 0

If I do this in my <head> tag:

<script type="text/javascript" src="foo.js"></script>

And inside foo.js I do this:

var foo = new Foo();
function Foo()
{
   //code here
}

Would this code reliably instantiate the variable foo even though its included above the function definition, or should I move it instead to the bottom of the file, like this:

function Foo()
{
   //code here
}
var foo = new Foo();
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Your example will work in any browser that follow the ECMAScript standard (all do at least with regards to this question).

    See sections 10.3-10.5 of the specification.

    First the local scope is set up and just thereafter the function body is actually run.

    Read 10.5 (the section is really not very long) to understand why @meder’s answer is right.

    If you don’t want to read the specs yourself:

    10.5 tells to declare variables in that order (overwriting if a some name occurs twice):

    Inheriting from outer scope = setting will affect the outer scope:

    • Variables of the surrounding scope.
    • The own function name.

    Local scope = setting won’t affect the outer scope:

    • The parameters (left to right).
    • The arguments object.
    • Declare all the inner variables (not overwriting the current value if any, undefined if none, yet)

    All in all:

    Returns the function x itself:

    function x() {
    return x;
}

    Returns the parameter x:

    function x(x) {
    return x;
}

    Returns the inner function x:

    function x(x) {
    return x; // the return does no harm, x is already set
    function x() {} // before the actual body is evaluated
}

    Also returns the inner function x:

    function x(x) {
    var x; // in this case a no-op 
    return x;
    function x() {}
}

    Returns 42:

    function x(x) {
    var x = 42; // overwrite x in local scope
    return x;
    function x() {}
}

    Returns the second argument:

    function x(x,x) { // assign left to right, last one "wins"
    return x; // arguments[0] would still name the first argument
}

    Returns 2 when x is called the second time, as x is set to the inner function:

    function x() {
    x = function() { return 2; } // set x in outer scope
    return 1;
}
    • 0