Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I call another function in the same javascript namespace?

Tags:

javascript

I like to organize my javascript in namespace style like below. What I want to know : is there another (shorter?) way to call myFirstFunction() from mySecondFunction()? I tried this.myFirstFunction() and it's not working so maybe there's some kind of mysterious trick here that I don't know.

var myNameSpace = {
    myFirstFunction: function(){
        alert("Hello World!");
    },
    mySecondFunction: function(){
        myNameSpace.myFirstFunction();
    }
}

Thanks for your help as usual, people of SO! :)

like image 344
Gabriel Avatar asked Nov 03 '10 02:11

Gabriel


People also ask

How do you call another function in JavaScript?

To call a function inside another function, define the inner function inside the outer function and invoke it. When using the function keyword, the function gets hoisted to the top of the scope and can be called from anywhere inside of the outer function.

Can I call a function inside another function JavaScript?

Approach: Write one function inside another function. Make a call to the inner function in the return statement of the outer function. Call it fun(a)(b) where a is parameter to outer and b is to the inner function.

Can I call a function multiple times JavaScript?

In order to run a function multiple times after a fixed amount of time, we are using few functions. setInterval() Method: This method calls a function at specified intervals(in ms). This method will call continuously the function until clearInterval() is run, or the window is closed.

How does namespace work in JavaScript?

Namespace refers to the programming paradigm of providing scope to the identifiers (names of types, functions, variables, etc) to prevent collisions between them. For instance, the same variable name might be required in a program in different contexts.


3 Answers

As written in your example code, this.myFirstFunction() would work. Your code is likely simplified to illustrate your problem, so it would probably help to see the actual code to tell why it doesn't work with this.

One possible reason that it fails would be if the code where you call this.myFirstFunction() is inside a closure. If so, this would be a reference to the closing function, not your namespace and would therefore fail. See here for a contrived example based on your code to see what I mean. Again, having a look at the actual code would probably be helpful to diagnose what's going on.

like image 52
Bryan Avatar answered Sep 19 '22 19:09

Bryan


Your suggestion to use 'this' should work. i.e.:

var myNameSpace = {
    myFirstFunction: function(){
        alert("Hello World!");
    },
    mySecondFunction: function(){
        this.myFirstFunction();
    }
}

Result:

myNameSpace.mySecondFunction() // "Hello World!".
like image 28
Hamish Avatar answered Sep 23 '22 19:09

Hamish


If you want it to be shorter maybe you should consider the following pattern:

Javascript Design Pattern Suggestion

basically for your example:

var myNameSpace = (function()
{
    function _myFirstFunction(){
        alert("Hello World!");
    }

    function _mySecondFunction(){
        _myFirstFunction();
    }

    return {
        MyFirstFunction : _myFirstFunction,    
        MySecondFunction : _mySecondFunction
    };
})();

I find this to be the cleanest pattern, also providing "private/public" variables in javascript that's otherwise pretty much impossible

like image 41
bevacqua Avatar answered Sep 19 '22 19:09

bevacqua