Undefined is not a function - new manager

[Shaz]

I am setting up a new manager based on the DataManager pattern.


The following works for DataManager:


DataManager.loadDatabase = function() {
...
this.loadDataFile(name, prefix + src);
...
};

DataManager.loadDataFile = function(name, src) {
...
}




but my manager gives me an Undefined is not a function error:


XRefManager.loadReferences = function() {
$dataActors.forEach(function(actor) { this.buildActorXRefs(actor); });
...
};

XRefManager.buildActorXRefs = function(actor) {
if (!actor) return;

};


The buildActorXRefs is what it's objecting to on the forEach line.


$dataActors exists and is populated at this point.


The first actor is null, but I moved the check for null actor into the forEach block and it made no difference.


My XRefManager is at the highest level, same as DataManager (not enclosed in my plugin function() {} body).


I'm hoping this will be obvious to someone else - it's sure not to me.


Edit: never mind.  Figured out I needed a .bind(this) on the function.  All working now.  Until the next issue.

 

[Hudell]

It's the classic javascript scope hell.


Instead of binding you could also call it this way:

XRefManager.loadReferences = function() {
    $dataActors.forEach(function(actor) { XRefManager.buildActorXRefs(actor); });
    ...
  };

 

[Shaz]

ooh - use the 'class' name instead of this?  Interesting!  Thanks

 

[Hudell]

Yup, since it's a "static" class (no use of prototype and instances) you can call it directy.

 

[Clock Out]

Context! Each function call has its own context, A.K.A. value for this.


XRefManager.loadReferences = function() {
// Has a context named this.

$dataActors.forEach(function(actor) {
// Also has its own context named this which is different than the
// one mentioned above.
this.buildActorXRefs(actor);
});
};

XRefManager.buildActorXRefs = function(actor) {
if (!actor) return;
};


Calling XRefManager.loadReferences() causes the context of the loadReferences() function to be XRefManager. The second bit to remember is that forEach() takes a second argument, the context for the callback function. Pass the context of loadReferences() to forEach() and you're all set.


XRefManager.loadReferences = function() {
// Has a context named this.

$dataActors.forEach(function(actor) {
this.buildActorXRefs(actor);
}, this /* Passing the context of loadReferences here causes it to be the callback function's context too. */);
};

XRefManager.buildActorXRefs = function(actor) {
if (!actor) return;
};


I hope this in-depth explanation helps anyone reading this topic in the future and I highly recommend reviewing scope and context from time to time even if it's confusing. Hopefully some of it will sink in over time.

 

[Shaz]

thanks.  I kinda figured that out already, on my first post

 

[Clock Out]

Yeah, it's mostly to re-frame the problem and solution using JavaScript jargon for future visitors. Oh, any to remind myself how it all works since I sometimes forget, too.

 

[Sharm]

This thread is being closed, due to being solved. If for some reason you would like this thread re-opened, please report this post and leave a message why. Thank you.