Calling jQuery document.ready handler with apply method?

Below is the code I am using in a project with some complex dependencies. After I have made sure that all the dependencies have been loaded I fire the onReadyCallback() also given below. I have two questions :

1. Is it correct to use, anonymousHandler.apply(MyNameSpace), the apply method on an anonymous Handler being called for Document.ready

2. From what I understand, because I am using the apply method the anonymous function will fire immediately irregardless of document's ready state. Then how can I pass in the context of MyNameSpace to the anonymousHandler so that "t开发者_StackOverflow中文版his" inside the function refers to MyNameSpace

   var onReadyCallback = function(){
       jQuery(document).ready(function(){
          if(!this.loggedIn()){
             return;
          }
          ...Lots of Code referring to MyNameSpace using "this"
   
       }.apply(MyNameSpace));
   };
   
   //load the additional files that are needed and fire onReadyCallback
   MyNameSpace.Util.loadFiles(defaultJsFiles,function(){ 
       MyNameSpace.Util.require(['My.App','My.Theme','My.DomHandler'], function(){
          onReadyCallback.apply(window);          
       });
   });
   

---

How about this, using an anonymous function and call?

jQuery(document).ready(function() {
    (function() {
        // this == MyNamespace
    }).call(MyNamespace);
});

---

Normally, the ready event jQuery function is called like this

$(function() { /* ... */ });
// or 
jQuery(function() { /* ... */ });
// or
jQuery(document).ready(function() { /* ... */ });

Bottom line, the function is not given a particular context; the actual context given by jQuery to the function is the HTMLDocument element, regardless of the argument (in the last example, document). Why is this so is another subject.

Generally, each of these functions are called later, after everything has been loaded, but not necessarily. In your case, there is a reference to MyNameSpace before the ready event happens. Even if Javascript is a LALR-type language, and it will find the symbol declared later, this is not a good practice. What if MyNameSpace would be set to something else later on, before jQuery triggers the ready callback functions? Your ready callback would not get that new reference. Unless intentional, the reference should be made inside the ready callback, when everything is.... ready.

Then, inside the ready callback, there are other techniques to assign a context to a function. lonesomeday have pretty much given the correct way to accomplish what you are trying to do.

(function() {
    // this == MyNamespace
}).call(MyNamespace);

The above code executes an anonymous function right away, where this == MyNameSpace

note : the difference between apply and call is decribed here

Now, comes the bottom part of the code you provided :

//load the additional files that are needed and fire onReadyCallback
MyNameSpace.Util.loadFiles(defaultJsFiles,function(){ 
    MyNameSpace.Util.require(['My.App','My.Theme','My.DomHandler'], function(){
       onReadyCallback.apply(window);          
    });
});

This is problematic, and unnecessary. Is the function onReadyCallback only needed there, or will it be called several times? If it needs to be called only once, spare the global namespace, and simply do :

//load the additional files that are needed and fire onReadyCallback
MyNameSpace.Util.loadFiles(defaultJsFiles,function(){ 
    MyNameSpace.Util.require(['My.App','My.Theme','My.DomHandler'], function(){

       // if everything is done loading, the function will be executed, otherwise
       // it's execution will be postponed later
       jQuery(function() {

           // create our nicely wrapped anonymous function now
           (function() {
              if(!this.loggedIn()){
                 return;
              }
              // ...Lots of Code referring to MyNameSpace using "this"

           })(MyNameSpace);  // grab our most recent reference of `MyNameSpace`

       });
    });
});

If you don't like the indentation (it's merely a developer's taste), replace everything in the ready callback with (something like) :

 initMyNameSpace.apply(MyNameSpace);

and create your function outside, on the global space :

 function initMyNameSpace() {
    if(!this.loggedIn()){
       return;
    }
    // ...Lots of Code referring to MyNameSpace using "this"

 };

But I would recommand, at least, to put it in the require callback function so it...

1. ...does not pollute the global namespace with a run-once function
2. ...is not accessible from anywhere (keep it private)
3. ...can be found quickly when editing the source code
4. etc.

note : usually, apply and call are used to avoid repeatedly accessing objects like some.thing.pretty.deep = value; or when one function needs to be applied to many but not all objects, and thus extending the object's prototype is just not a good idea.

This is my opinion anyway, and how I would do things, without any more knowledge of your code or what you are doing.