Namespacing issue in Javascript

Question

I'm trying to convert a regular function into function with namespacing. This is the regular function:

surprise();    

function surprise() {
    alert('TEST');
}

and this is the same function with namespacing:

var namespace = {};

namespace.surprise();

namespace.surprise = function () {
    alert('TEST');
};

I get the following error: Uncaught TypeError: namespace.surprise is not a function

Worked for me on js fiddle as well. Andrew beat me by 45 seconds. > — user2278120, Sep 04 '16 at 14:43
@AndrewL. I just realised that I was calling the function from above it. I didn't know that's an issue? It's not an issue with normal functions without namespacing — user6793397, Sep 04 '16 at 14:46
What do you mean you were calling the function from above it? — Andrew Li, Sep 04 '16 at 14:48
@AndrewL. I have edited the code in the question to make it clearer — user6793397, Sep 04 '16 at 14:54
@user6793397 I've added a full explanation to why you get a typeerror — Andrew Li, Sep 04 '16 at 15:01

score 0 · Accepted Answer · edited May 23 '17 at 12:16

If you call before a function is defined, you will get a TypeError. You must defined the function first. Before you define it, the namespace does not have a surprise function, and once you call it, JavaScript doesn't know what you're talking about.

The reason why normal functions do not need to be defined first is because:

The function statement is magic and causes its identifier to be bound before anything in its code-block* is executed.

That's from here. function statements must be defined with the function keyword and not stored in a variable like this:

var myFunc = function () {
    ...
}

To be treated in the described way above. Since namespaces store the function into a variable, they lose the capability of being used before it's defined.

Namespacing issue in Javascript

1 Answers1