javascript namespace call other function methods

Question

I try to change some way to call methods into namespace.

Calling parent methods (I dont think its possible)
Creating and call inheritance function
Calling inside another method (mostly jquery onReady event function) (this.MyFunction() not working)

I split every namespace in files (want to keep it that way)

I try How to call function A from function B within the same namespace? but I didn't succed to split namespaces.

my fiddle sample got only 1 sub-namespace but could be more.

 /**************************************************************************
    // FILE Master.js
    ***************************************************************************/
    if (!Master) var Master = {}; 
    Master.Print= function(text){
        console.log("master.Print :" + text);
      $("body").append("<div>master.Print : " + text + "</div>");
    }

    /**************************************************************************
    // FILE Master.Test1.js
    ***************************************************************************/
    if (!Master) var Master = {};
    if (!Master.Test1) Master.Test1  = {};
    /**************************************************************************
    * Descrition :
    *   Function for managing event load/documentReady
    **************************************************************************/
    Master.Test1.onReady = function () {
        $(function () {
            Master.Test1.Function1();   //try to replace because need all namespace.          

            try {
                   this.Function2(); //not working
            }
            catch(err) {
                console.log("this.Function2 not working");
                $("body").append("<div>this.Function2 not working</div>");
            }   

           try {
                this.Print("onReady");  //not working
           }
           catch(err) {
                console.log("this.Print not working");
              $("body").append("<div>this.Print not working</div>");
           }

          try {
                Print("onReady"); //not working
          }
          catch(err) {
                console.log("Print not working");
                $("body").append("<div>Print not working</div>");
          }     

        });
    }

    Master.Test1.Function1 = function () {
        console.log("Function1");
        $("body").append("<div>Function1</div>");    
        this.Function3();      //working because not inside another function   
    }

    Master.Test1.Function2 = function () {
            $("body").append("<div>Function2</div>");
        console.log("Function2");   

    }


    Master.Test1.Function3 = function () {
            $("body").append("<div>Function3</div>");
        console.log("Function3");

        Master.Print("Function3");  //try to replace because need all namespace.        
    }

    Master.Test1.onReady();

I use Master.Test1.Function1(); and I want to change that because Function1 is inside the same namespace.
I use Master.Print("Function3"); I dont think I can change that. the way I try to use it, it's more an inheritance function. but I dont know if theres a way to do that?

Maybe I should change the my namespace methode? maybe prototype will do what I want?

Saravana · Accepted Answer · 2017-05-26 03:19:23Z

1

You can capture the this in a variable because this inside $(function() {}) will point to document object. The below will work provided you never change the calling context of onReady -- i.e. it is always called on the Test1 object and not called on other context:

Master.Test1.onReady = function () {
    var self = this;
    $(function () {
        self.Function1();
        // ..
    });
}

To access Print you have to reference using the Master object like: Master.Print() as it won't be available in the Test1 object

answered May 26, 2017 at 3:19

Saravana

41k20 gold badges110 silver badges112 bronze badges

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

Comments

guest271314 · Accepted Answer · 2017-05-26 03:16:00Z

0

this is document within .ready() or jQuery() alias for .ready() where function(){} is parameter $(function() {}). this at this.Function2() will reference document.

answered May 26, 2017 at 3:16

guest271314

1

Comments

pacifier21 · Accepted Answer · 2017-05-26 03:24:21Z

0

"Objects" in javascript are not built the same way as in most object-oriented languages. Essentially, what you are building is a hierarchy of static methods that have no real internal state in-and-of themselves. Therefore, when one of the defined methods is invoked, the context (or state) of that method depends on what object invoked the method.

If you want to have any internal context, you will need to create an "instance" of an "object prototype". At that point, you can use "this.otherFunction" within your other functions. Here is a small example:

var MyObject = function() {};

MyObject.functionOne = function() {
    console.log("Function 1");
    this.functionTwo();
};

MyObject.functionTwo = function() {
    console.log("Function 2");
};

var instanceOne = new MyObject();
instanceOne.functionOne();

You might get some more information about object definition here

answered May 26, 2017 at 3:24

pacifier21

8131 gold badge5 silver badges13 bronze badges

1 Comment

forX Over a year ago

most of the time, function are use as static (no need to create an instance). but its a way to do it. unfortunately, the problem for sub function is still there. the answer of saravana is more usefull for my problem.

Collectives™ on Stack Overflow

javascript namespace call other function methods

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related