javascript namespace call other methods of function

advertisements

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.

https://jsfiddle.net/forX/kv1w2rvc/

 /**************************************************************************
    // 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?


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