call function in external file using namespaces

Question

Say I have 2 files, let's call them file1 and file2. Let's say file1 has a function called func1() and file2 has a function called func2()

So file1 looks something like this:

   function func1() {
      alert("func1 called");
   }

and file2 looks like this:

function func2() {
      alert("func1 called");
}

If I have loaded the file1 before the file2 in the head section of the html, I can then (in the file2) call func1 like this:

function func2() {
    func1();
}

But now... What I want to do, is to call it using a namespace. Here is where the trouble comes for me. I have read a lot about JavaScript namespacing, but the most thorough one I found is this: http://addyosmani.com/blog/essential-js-namespacing/#beginners

The problem however (like in other examples I found) is that there is too much to theory/reading (which is not a problem since it teaches a lot). By the time I have read all that, my head is so full and confused (I am new to programming, so can't handle so much yet). What I am missing from that example/link, is an explanation telling me how to make things work from 2 separate files.

So I figured I can do something like this in the file1:

var namespaceFile1 = namespaceFile1 || {};

function func1() {
    alert("func1 called");
}

What I want to be able to do now, is call the func1 using the namespace, like this:

function func2() {
  namespaceFile1.func1();
}

Trying the above solution, I get a JS error saying that namespaceFile1 does not exist, even though I declared it saying: var namespaceFile1 = namespaceFile1 || {};

How can I do this? Thanks in advance

Quentin · Accepted Answer · 2015-07-29 08:47:40Z

2

You've created a "namespace" (which is just a variable holding an object), but you've made the function a global instead of putting it in that namespace.

var namespaceFile1 = namespaceFile1 || {};

namespaceFile1.func1 = function func1() {
    alert("func1 called");
}

I get a JS error saying that namespaceFile1 does not exist

If it claims that, then you are trying to call namespaceFile1.func1() before you've loaded the JS file that defines namespaceFile1.

From the code you've shown, I'd expect it to say that namespaceFile1.func1 doesn't exist (i.e. "is not a function" rather than "can't access property of undefined").

You might have both errors though. Make sure you load the script that defines the function before you try to call it.

answered Jul 29, 2015 at 8:47

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

anotherdev · Accepted Answer · 2015-07-29 08:50:08Z

0

Loading 2 js files is like concatenating them. Your code should be:

var namespaceFile1 = {};

namespaceFile1.func1 = function () {
    alert("func1 called");
}

function func2() {
  namespaceFile1.func1();
}

When you speak of "namespace", it's in fact an object in which you add attributes or functions.

edited Jul 29, 2015 at 8:50

answered Jul 29, 2015 at 8:47

anotherdev

2,5671 gold badge16 silver badges24 bronze badges

8 Comments

Quentin Over a year ago

namespaceFile1.func1() doesn't exist in that code, so you can't call it. (You have now edited the code so this is no longer the case)

CodingIntrigue Over a year ago

In the OP's question, they state that namespaceFile1 should only be created if it doesn't already exist. var namespaceFile1 = {};

Quentin Over a year ago

In the OP's original code, namespaceFile1 is only created if it doesn't already exist. Your change (removing namespaceFile1 ||) means that you'll always overwrite the content of the variable, wiping out the existing object if one exists. That's the opposite of what the bit you quoted in your last comment is asking for.

CodingIntrigue Over a year ago

@Quentin This isn't my answer :) I was pointing out it's missing here, I should have @'d the answerer so it doesn't look like I was replying to your comment

CodingIntrigue Over a year ago

@PierreEmmanuelLallemant You're assuming the files are loaded sequentially. They may not be. It's also quite common to put logic from the same namespace in separate files.

|

Collectives™ on Stack Overflow

call function in external file using namespaces

2 Answers 2

Comments

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related