Problems with calling function from one js file to another

Question

In the file data.js i have:

(function () {

   data() 

   function runThisWhenDataIsFinished() {

        console.log("Works!"); 

   }


})();

In the file app.js i have

function data() {

    console.log("Im in the data function");

    runThisWhenDataIsFinished();

}

When i call on data() i get the message "Im in the data function", when i try to call on the runThisWhenDataIsFinished() method i get error: runThisWhenDataIsFinished() method is not defined.

So how can i access runThisWhenDataIsFinished method in data.js from app.js?

Best regards

Josh · Accepted Answer · 2013-02-22 13:42:15Z

2

You can't do this because runThisWhenDataIsFinished is lexically scoped (to it's parent function). If you want to be able to access it outside of that scope you will have to use some sort of global namespace.

See http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth

answered Feb 22, 2013 at 13:42

Josh

45k7 gold badges106 silver badges125 bronze badges

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

Comments

Curtis · Accepted Answer · 2013-02-22 13:42:31Z

2

It's not so much that these are in different files, but that runThisWhenDataIsFinished() is in an anonymous function. If you move this outside of the function, as long as data.js has been loaded before making a data() call it will run it correctly.

answered Feb 22, 2013 at 13:42

Curtis

104k69 gold badges280 silver badges359 bronze badges

2 Comments

ilan berci Over a year ago

Technically, runThisWhenDataIsFinished is not an anonymous function, it is scoped to the function that it is defined in. In order to be an anonymous function, it can't be named. :) Not trying to be an asshat, just trying to avoid confusion for the op.

Curtis Over a year ago

@ilanberci I didn't say runThisWhenDataIsFinished() is an anonymous function. I said its in an anonymous function. It is scoped to an anonymous function.

phtrivier · Accepted Answer · 2013-02-22 13:57:09Z

0

A few comments :

first, you define "runThisWhenDataIsFinished" after calling the "data()" function ; so there is no way the function is defined
event if you call "data()" after defining the function, it will not work, because, as explaied otherwise, it will only be defined in the scope of the anonymous function.

There is something that would work, but do not do that :

function data() {

  console.log("Im in the data function");

  // The 'globalRunThisWhenDataIsFinished' function is no defined in this scope, 
  // so it will only be called if it exists as a *global* variable
  globalRunThisWhenDataIsFinished();

}

(function () {

   // When calling the anonymous function like you do, 
   // 'this' is the Window object, so you can add "global" variables
   // like this. However you probably DO NOT WANT TO DO THAT
   this.globalRunThisWhenDataIsFinished = function() {

      console.log("Works!"); 

   }

   data();

})();

As pointed out, I suggest you look at the Module pattern to understand what you really want to do.

answered Feb 22, 2013 at 13:57

phtrivier

13.5k9 gold badges54 silver badges82 bronze badges

1 Comment

rubin Over a year ago

I understand never use global var, if you read my other questions you will get the context what im doing: stackoverflow.com/questions/15026352/… i cant get it to work, it like a dead end =)

Collectives™ on Stack Overflow

Problems with calling function from one js file to another

3 Answers 3

Comments

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related